.text()
.text() 返回: String
描述: 得到匹配元素集合中每個元素的文本內(nèi)容結(jié)合,包括他們的后代。
version added: 1.0.text()
和 .html() 方法不同, .text() 在XML 和 HTML 文檔中都能使用。 .text() 方法的結(jié)果是由所有匹配元素包含的文本內(nèi)容組合起來的文本 (由于不同的瀏覽器對HTML分析器的不同,在返回的文本換行和其他空格可能會有所不同。) 考慮下面的HTML:
<div class="demo-container"> <div class="demo-box">Demonstration Box</div> <ul> <li>list item 1</li> <li>list <strong>item</strong> 2</li> </ul> </div>
$('div.demo-container').text() 代碼會產(chǎn)生一下結(jié)果:
Demonstration Box list item 1 list item 2
.text() 方法不能使用在 input 元素上。 輸入的文本需要使用 .val() 方法。
在 jQuery 1.4中, .text() 方法返回值是文本和 CDATA 節(jié)點,以及元素節(jié)點。
舉例:
在一個段落中查找文本(去除了HTML),然后設(shè)置最后一個段落的HTML為剛才的那段文本(紅色粗體消失)。
<!DOCTYPE html>
<html>
<head>
<style>
p { color:blue; margin:8px; }
b { color:red; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
<p><b>Test</b> Paragraph.</p>
<p></p>
<script>
var str = $("p:first").text();
$("p:last").html(str);
</script>
</body>
</html>
Demo:
.text( textString ) 返回: jQuery
描述:設(shè)置匹配元素集合中每個元素的文本內(nèi)容為指定的文本內(nèi)容。
-
version added: 1.0.text( textString )
textString用于設(shè)置匹配元素內(nèi)容的文本
-
version added: 1.4.text( function(index, text) )
function(index, text)用來返回設(shè)置文本內(nèi)容的一個函數(shù)。接收元素的索引位置和元素舊的文本值作為參數(shù)。
和 .html() 方法不同, .text() 在XML 和 HTML 文檔中都能使用。
我們必須意識到這種方法提供了必要的字符串從提供的正確的HTML中脫離出來。這樣做, 他調(diào)用DOM 方法 .createTextNode(), 一種替代的特殊字符與HTML對應(yīng)(比如< 替換為 < )方法??紤]下面的html:
<div class="demo-container">
<div class="demo-box">Demonstration Box</div>
<ul>
<li>list item 1</li>
<li>list <strong>item</strong> 2</li>
</ul>
</div>
$('div.demo-container').text('<p>This is a test.</p>');代碼語句將輸出以下 DOM :
<div class="demo-container"> <p>This is a test.</p> </div>
它會出現(xiàn)在渲染的頁面上就好像標(biāo)簽被暴露,像這樣:
<p>This is a test</p>
.text() 方法不能使用在 input 元素上。 輸入的文本需要使用 .val() 方法。
在 jQuery 1.4中, .text()方法允許我們通過函數(shù)來傳遞文本內(nèi)容。
$('ul li').text(function(index) {
return 'item number ' + (index + 1);
});
給定一個擁有3個<li>元素,在這個例子中將輸出下面的DOM:
<ul> <li>item number 1</li> <li>item number 2</li> <li>item number 3</li> </ul>
舉例:
在段落中添加文本。注意這個<b>標(biāo)簽將從HTML中脫離出來。
<!DOCTYPE html>
<html>
<head>
<style>
p { color:blue; margin:8px; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
<p>Test Paragraph.</p>
<script>$("p").text("<b>Some</b> new text.");</script>
</body>
</html>