jQuery学习- 获取与设置属性的函数

Posted whzym111

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery学习- 获取与设置属性的函数相关的知识,希望对你有一定的参考价值。

 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>属性访问与设置</title>
            <script src="js/jquery.js"></script>
        <style>
        .astyle{ border: 1px solid red;}
        </style>
        
        <script type="text/javascript">    
            //页面加载完成简写形式
            $(function(){
                //设置baidu超链接地址,attr()函数的用意是设置或获取指定属性的内容
                //attr()函数不是javascript自带函数,而是由jQuery进行扩展的函数
                //使用attr函数设置属性值的时候需要两个参数:参数名,参数值
                $("#abaidu").attr("href","http://www.baidu.com");
                
                //设置img的 图片为1.jpg ,宽度300px  ,提示信息:图片
                $("#img1").attr("src","img/1.jpg");
                $("#img1").attr("alt","图片");
                $("#img1").attr("width","300px");
                
                //简化多次赋值,多次复值 时候参数为json对象
                $("#img2").attr({"src":"img/2.jpg","width":"200","alt":"图2"});
                
                //取得第二张图片的名称
                var r = $("img:eq(1)").attr("src");
                alert(r);
                
                //为全部checkbox设置为选中状态
                //$("input[type=\'checkbox\']").attr("checked","checked");
                
                //将第一个和第四个checkbox设置红色边框 使用组合选择器
                $("input[type=\'checkbox\']:eq(0),input[type=\'checkbox\']:eq(3)").attr("checked","checked");
            })
        
        </script>
    </head>
    <body>
    <div>
        <a href="#" id="abaidu">baidu</a>
        <a href="#">sina</a>
        <a href="#">1688</a>
        <a href="#">taobao</a>
        <a href="#">tianya</a>
        <br>
        <img id="img1" />图1
        <img id="img2" />图2 
        <input type="checkbox" name="letter" value="A" />A
         <input type="checkbox" name="letter" value="B" />B
         <input type="checkbox" name="letter" value="C" />C
         <input type="checkbox" name="letter" value="D" />D
        <input type="checkbox" name="letter" value="E" />E                                                        
        
    </div>
    </body>
</html>

 

以上是关于jQuery学习- 获取与设置属性的函数的主要内容,如果未能解决你的问题,请参考以下文章

jQuery属性与样式

jQuery的属性与样式之.attr()与.removeAttr()

回炉重造JQuery 获取和设置元素内容/属性

jQuery属性和样式

jquery常用的jquery获取表单对象的属性与值

jQ选择器学习片段(JavaScript 部分对应)