zoukankan      html  css  js  c++  java
  • jQuery DOM Manipulation 中text() html() val()的区别

    1.html()

    html() 方法设置或返回被选元素的内容(innerHTML)。

    当该方法用于返回内容时,则返回第一个匹配元素的内容。

    当该方法用于设置内容时,则重写所有匹配元素的内容。

    提示:如只需设置或返回被选元素的文本内容,请使用text()方法。

    2.text() 

    text() 方法设置或返回被选元素的文本内容。

    当该方法用于返回内容时,则返回所有匹配元素的文本内容(会删除 HTML 标记)。

    当该方法用于设置内容时,则重写所有匹配元素的内容。

    提示:如需设置或返回被选元素的 innerHTML(文本 + HTML 标记),请使用html()方法。

    3.val()

    val() 方法返回或设置被选元素的 value 属性。

    当用于返回值时:
    该方法返回第一个匹配元素的 value 属性的值。

    当用于设置值时:
    该方法设置所有匹配元素的 value 属性的值。

    注意:val() 方法通常与 HTML 表单元素一起使用。

    例:

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4     <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
     5         <script>
     6             $(document).ready(function(){
     7               $("button").click(function(){
     8                 alert($("button").val());//text()、html()
     9               });
    10             });
    11         </script>
    12     </head>
    13     <body>
    14         <button value="one">1</button>
    15         <button value="two">2</button>
    16     </body>
    17 </html>   

      1.当使用val()会返回第一个button的value值,当未设定时,返回被选元素的当前值。

      2.设定button的value后,val()返回“one”,即第一个button的value值。

      3.当使用text()会返回所有button的内容的组合,即“12”.

      4.当使用html()会返回第一个button的html内容。

      5.当把14行的内容改为<button value="one"><p>1</p></button>时:

        button.val()会返回one

        button.text()会返回1

        button.html()会返回<p>1</p>

      这就是三个获取&设定内容的方法的区别。

  • 相关阅读:
    GCD 并行子线程
    iOS开发>学无止境
    iOS开发>学无止境
    iOS开发>学无止境
    FMDB使用
    递归
    局部变量与全局变量
    函数式编程与参数
    文件的操作
    集合的操作
  • 原文地址:https://www.cnblogs.com/niulina/p/5679433.html
Copyright © 2011-2022 走看看