jQuery text()

本文概述

  • jQuery text()方法和jQuery html()方法之间的区别
  • jQuery text()方法的参数
  • jQuery text()方法的示例
  • jQuery text()方法的另一个示例
jQuery text()方法用于设置或返回所选元素的文本内容。
返回内容:使用此方法返回内容时, 它将返回所有匹配元素的组合文本内容, 而没有HTML标记。
设置内容:使用此方法设置内容时, 它将覆盖所有匹配元素的内容。
jQuery text()方法和jQuery html()方法之间的区别有时, 由于这两种方法都用于设置或返回html内容, 所以会造成这种混乱。但是, jQuery text()方法不同于html()方法。
以下是主要区别:
  • jQuery text()方法用于设置或返回没有HTML标记的html内容, 而html()方法用于设置或返回innerHtml(文本+ HTML标记)。
  • jQuery text()方法可以在XML和HTML文档中使用, 而jQuery html()方法则不能。
句法:
要返回文本内容:
$(selector).text()

设置文本内容:
$(selector).text(content)

要使用功能设置文本内容:
$(selector).text(function(index, currentcontent))

jQuery text()方法的参数
参数 描述
Content 它是必填参数。它为所选元素指定新的文本内容。特殊字符将在此参数中编码。
Function (index, currentcontent) 它是一个可选参数。它指定返回所选元素的新文本??内容的函数。索引:提供元素在集合中的索引位置。 Currentcontent:提供所选元素的当前内容。
jQuery text()方法的示例让我们以一个示例来演示jQuery text()方法的效果。
一个简单的返回内容的示例:

< !DOCTYPE html> < html lang="en"> < head> < meta charset="utf-8"> < title> text demo< /title> < style> p { color: blue; margin: 8px; } b { color: red; } < /style> < script src="http://img.readke.com/220429/2304151035-0.jpg"> < /script> < /head> < body> < p> < b> Hello! < /b> srcmini.com< /p> < p> < /p> < script> var str = $( "p:first" ).text(); $( "p:last" ).html( str ); < /script> < /body> < /html>

立即测试
输出:
你好! srcmini.com
你好! srcmini.com
jQuery text()方法的另一个示例设置内容的示例:
< !DOCTYPE html> < html> < head> < script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> < /script> < script> $(document).ready(function(){ $("button").click(function(){ $("p").text("Welcome to srcmini.com!"); }); }); < /script> < /head> < body> < button> Click here to set text content for all p elements< /button> < p> Hello Guys!< /p> < p> Looking for online training....< /p> < /body> < /html>

立即测试
输出:
单击此处设置所有p元素的文本内容
大家好!
【jQuery text()】寻找在线培训。

    推荐阅读