[JQ权威指南]第六天:使用attr获取与设置元素的属性

最新推荐文章于 2020-10-09 16:31:43 发布

厦门德仔

最新推荐文章于 2020-10-09 16:31:43 发布

阅读量1.1k

点赞数

分类专栏： # JQuery 文章标签：标记

本文链接：https://blog.csdn.net/david_520042/article/details/46603109

版权

JQuery 专栏收录该内容

63 篇文章 0 订阅

订阅专栏

获取：
在一个页面中，创建一个标记，通过JQUERY中的attr()方法获取标记的src和title属性值，并显示到页面中。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>获取元素的属性</title>
    <script type="text/javascript" src="../jquery-2.1.4.js"></script>
    <style  type="text/css">
        body{ font-size:12px;}
        div{ float:left; padding-left:101px;}
        img{ border:solid 1px #ccc; padding:3px; float:left;}
    </style>
    <script type="text/javascript">
        $(function(){
            var strAlt=$("img").attr("src");
            strAlt +="<br/><br/>"+$("img").attr("title");
            $("#divAlt").html(strAlt);
            })
    </script>
</head>
    <img alt="" title="这是一幅风景画" src="Images/img01.jpg" />
    <div  id="divAlt"></div>
<body>
</body>
</html>

页面执行效果

二：设置元素的属性
attr(name.value)
在页面中创建一个标记，在页面加载时，通过jquery中的attr()方法设置该标记的img和title属性值，并显示在页面中。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>设置元素的属性</title>
    <script type="text/javascript" src="../jquery-2.1.4.js"></script>
    <style  type="text/css">
        body{ font-size:12px;}
        .clsSpan{ float:left; padding-top:10px; padding-left:10px;}
        .clsImg{ border:solid 1px #ccc; padding:5px; float:left;}
    </style>
    <script type="text/javascript">
        $(function(){
//          $("img").attr("src","Images/img01.jpg");
//          $("img").attr("title","这是一幅风景画");
            $("img").attr({src: "Images/img02.jpg",title: "这是一幅风景画"});
            $("img").addClass("clsImg");
            $("span").html("加载完毕");
            })
    </script>
</head>
<body>
    <img alt="" src="Images/img03.gif" style="float:left" />
    <span class="clsSpan">正在加载图片</span>
</body>
</html>

页面效果

厦门德仔

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
[JQ权威指南]第六天:使用attr获取与设置元素的属性

获取：在一个页面中，创建一个标记，通过JQUERY中的attr()方法获取标记的src和title属性值，并显示到页面中。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns=
复制链接

扫一扫