$().attr()的用法 && $().html()与$().text()的区别

最新推荐文章于 2023-10-13 18:00:25 发布

无盐海

最新推荐文章于 2023-10-13 18:00:25 发布

阅读量5.5k

点赞数 1

分类专栏： JQuery 文章标签： .thml与.text的区别

本文链接：https://blog.csdn.net/Fanbin168/article/details/38186569

版权

JQuery 专栏收录该内容

53 篇文章 0 订阅

订阅专栏

<1>$().attr()的用法

</pre><pre class="html" name="code"><html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="script/jquery-1.11.0.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            //attr用来设置Jquery没有封装的对象属性
            //-----------------------------------------------------------------------------

            $("#btnSubmit").attr("disabled", "true"); //attr用来设置Jquery没有封装的对象属性，因为Jquery没有封装disabled属性，这就是通过attr来将获取到的对象的disabled属性设为true。


            //-----------------------------------------------------------------------------

            //将input的class属性名字设为"inputClass"
            $("input").attr("class", "inputClass"); 
            
            //-----------------------------------------------------------------------------

            //这里将img的两个属性一并设置了值，就可以用到json格式：{"属性1"：值,"属性2"：值}
            $("img").attr({ "src": "/images/123.jpg", "alt": "123456" });



            // $("img").attr({ "src": "/images/123.jpg", "alt": "美女图片" }); 也可以写成下面的形式
            $("img").attr("src", "/images/123.jpg").attr("alt", "美女图片");

            //-----------------------------------------------------------------------------

            //将a标签的href属性设为"http://www.baidu.com",将它的html()内容设为"百度"
            $("a").attr("href", "http://www.baidu.com").html("百度");
        })
       
    </script>
</head>
<body>
<input type="button"  value="提交" id="btnSubmit" />
<img/>
<a></a>
</body>
</html>

<2>$().thml()与$().text()的区别

案例1：

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="http://localhost:41928/Jquery/jquery-1.10.2.js" type="text/javascript"></script>
    <script type="text/javascript">
        
        $(function () {
            //.thml()是在块中加html代码
            $("div").html("<a href='http://www.baidu.com'>百度</a>"); 
            alert($("div").text());  //输出是是一个百度的超链接
        })

        $(function () {
            //.text()是在块中的文字
            $("div").text("<a href='http://www.baidu.com'>百度</a>");
            alert($("div").text()); //输出的是 【<a href='http://www.baidu.com'>百度</a>】这么一段文字
        })

      
    </script>
</head>
<body>
<div></div>

</body>
</html>

案例2：

<html>
<head>
    <script src="~/Scripts/jquery-3.3.1.slim.js"></script>
</head>
<body>
    <div id="mydiv"><span>今天天气不错，挺风和日丽的</span></div>
</body>
</html>
<script type="text/javascript">
    $(function () {
        console.log($("#mydiv").text()); //输出：今天天气不错，挺风和日丽的

        console.log($("#mydiv").html()); //输出：<span>今天天气不错，挺风和日丽的</span>
    })
</script>

http://blog.sina.com.cn/s/blog_561be372010008ev.html

无盐海

关注

1
点赞
踩
9

收藏

觉得还不错? 一键收藏
1
评论
$().attr()的用法 && $().html()与$().text()的区别

&lt;1&gt;$().attr()的用法&lt;/pre&gt;&lt;pre class="html" name="code"&gt;&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;&lt;head&gt; &lt;title&gt;&lt;/title&gt;
复制链接

扫一扫