本文概述
- jQuery text()方法和jQuery html()方法之间的区别
- 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:提供所选元素的当前内容。 |
一个简单的返回内容的示例:
<
!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()】寻找在线培训。
推荐阅读
- jQuery toggleClass()
- jQuery Submit()
- jQuery slideUp()
- jQuery slideToggle()
- jQuery show()
- jQuery serializeArray()
- jQuery serialize()
- jQuery选择器
- jQuery select()