jQuery 中 text() 和 html() 方法的区别

Text() 方法：此方法返回所选元素的文本内容。它在设置内容时覆盖所有匹配元素的内容。

句法：

• 返回文本内容：

  $(selector).text()

• 设置文本内容：

  $(selector).text(content)

• 使用函数设置文本内容：

  $(selector).text(function(index, currentcontent))

html() 方法：该方法用于设置或返回被选元素的内容(innerHTML)。它返回第一个匹配元素的内容或设置所有匹配元素的内容。

句法：

• 返回内容：

  $(selector).html()

• 设置内容：

  $(selector).html(content)

• 使用函数设置内容：

  $(selector).html(function(index, currentcontent))

例子：

  

    
    
  
    
        $(document).ready(function () {
            $("#button1").click(function () {
                alert("Using text()- " + $("#demo").text());
            });
            $("#button2").click(function () {
                prompt("Using html()- " + $("#demo").html());
            });
        });
    

  

    By clicking on the below buttons,
        difference between
        text and html in
        jQuery is shown.
    
  
    Text
    HTML

  

输出：

单击按钮之前：

单击文本按钮后：

单击 html 按钮后：

text() 和 html() 方法的区别：

text() method	html() method
It is used to set or return the text content of selected elements.	It is used to set or return the content of selected elements.
This method cannot be used on form inputs or scripts.	This method can not be used for value of a script element.
It is used in both XML and HTML documents.	It is used only for HTML documents.
It is slower than html().	It is ~2x faster than .text().

支持的浏览器：

• 谷歌浏览器
• IE浏览器
• 火狐
• 歌剧
• 苹果浏览器