码迷,mamicode.com
首页 > Web开发 > 详细

jQuery学习之------html()和text()

时间:2017-11-04 15:08:51      阅读:176      评论:0      收藏:0      [点我收藏+]

标签:func   ges   javascrip   png   使用   auto   ret   font   赋值   

jQuery学习之------html()和text()

 

.html与.text的异同:

  1. .html与.text的方法操作是一样,只是在具体针对处理对象不同
  2. .html处理的是元素内容,.text处理的是文本内容
  3. .html只能使用在HTML文档中,.text 在XML 和 HTML 文档中都能使用
  4. 如果处理的对象只有一个子文本节点,那么html处理的结果与text是一样的
  5. 火狐不支持innerText属性,用了类似的textContent属性,.text()方法综合了2个属性的支持,所以可以兼容所有浏览器

例子:

<div class="soulsjie">
    <h1>soulsjie</h1>
    <h3>.html()与.text()</h3>
</div>

<h4>显示通过html方法获取到的内容</h4>
    <p></p>
<h4>显示通过text方法获取到的内容</h4>
    <p></p>

 

<script type="text/javascript">
        //显示出html方法获取到的内容
        //.html()是整个html文档结构
        $(‘p:first‘).text( $(".soulsjie").html() )

   //显示出text方法获取到的内容
        //.text()是文本内容的合集
        $(‘p:last‘).text( $(".soulsjie").text() )

</script>

输出结果:
技术分享

 

简单的说使用.html()能够获取到HTML的标签和内容,而使用.text()只能获取到标签的内容

//通过.text()的回调,获取原本的内容,修改,在重新赋值

<script type="text/javascript">
        $(".left a:first").text(function(idnex,text){

  // index是索引值的意思,索引的就是$(‘.left a:first‘),另一个参数text是$(‘.left a:first‘)中已有的文本内容
            return ‘增加新的文本内容‘ + text
        })
    </script>


      

jQuery学习之------html()和text()

标签:func   ges   javascrip   png   使用   auto   ret   font   赋值   

原文地址:http://www.cnblogs.com/soulsjie/p/7783182.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!