首页 > 代码库 > jQuery学习- 获取与设置属性的函数

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

2024-08-21 02:54:35   221人阅读

技术分享

 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>属性访问与设置</title>
            <script src=http://www.mamicode.com/"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=http://www.mamicode.com/"#" id="abaidu">baidu</a>
        <a href=http://www.mamicode.com/"#">sina</a>
        <a href=http://www.mamicode.com/"#">1688</a>
        <a href=http://www.mamicode.com/"#">taobao</a>
        <a href=http://www.mamicode.com/"#">tianya</a>
        <br>
        <img id="img1" />图1
        <img id="img2" />图2 
        <input type="checkbox" name="letter" value=http://www.mamicode.com/"A" />A
         <input type="checkbox" name="letter" value=http://www.mamicode.com/"B" />B
         <input type="checkbox" name="letter" value=http://www.mamicode.com/"C" />C
         <input type="checkbox" name="letter" value=http://www.mamicode.com/"D" />D
        <input type="checkbox" name="letter" value=http://www.mamicode.com/"E" />E                                                        
        
    </div>
    </body>
</html>

 

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


联系
我们