HOWTO · jQuery
如何在 jQuery 中更改文本
使用 jQuery 的 text() 方法读取元素的文本，或将其替换为新文本，既可以直接替换，也可以在响应点击时替换。
本页内容
使用 jQuery 的 text() 方法，可以读取选中元素中的文本，也可以为其设置新文本。不带参数调用 .text() 可读取文本；传入字符串则会替换选中元素的文本内容。
jQuery 中的 text() 方法
不带参数的 .text() 是 getter（读取器）：它会返回所有匹配元素的文本内容合并结果。例如，若页面包含 <p id="line">It's a line.</p>，那么 $('#line').text() 会返回 It's a line.。这个调用读取当前文本，不会设置值。
传入值时，.text(value) 是 setter（设置器）。它会更新每个匹配元素的文本内容，并返回 jQuery 集合，因此可以链式调用。传入的值会作为文本处理，所以 <strong> 这样的标记字符会显示为文本，而不会被解析为 HTML。只有在确实需要设置标记，并且已安全处理任何不可信输入时，才使用 .html()。
使用 jQuery 的 text() 方法直接更改文本
在浏览器页面中加载 jQuery，并在文档就绪后调用 setter。下面的 Node 示例用一个精简的页面和 jQuery 选择器替身，让同样的调用可以独立运行。示例从包含“Text”的段落开始，设置其文本后打印结果：
const document = {};
const elements = { '#title': { text: 'Text' } };
function $(selector) {
if (selector === document) {
return { ready(callback) { callback(); } };
}
const element = elements[selector];
return {
text(value) {
if (value === undefined) return element.text;
element.text = value;
return this;
}
};
}
$(document).ready(function() {
$('#title').text('New Text');
});
console.log($('#title').text());
New Text
在实际页面中，可以在 ready 回调中使用 <p id="title">Text</p>，并调用相同的 $('#title').text('New Text') setter。回调执行后，段落会显示“New Text”。Node 替身演示了方法调用；要在浏览器中使用页面本身，还必须加载 jQuery。
使用 jQuery 的 text() 方法通过点击事件更改文本
要在点击后更新文本，可为按钮绑定处理函数，并在函数中对目标段落调用 .text()。下面这个独立的 Node 示例模拟了一个段落和按钮，然后调用已注册的处理函数，展示点击前后的文本：
const document = {};
const elements = {
'#title': { text: 'Text' },
'#press': {}
};
const handlers = {};
function $(selector) {
if (selector === document) {
return { ready(callback) { callback(); } };
}
const element = elements[selector];
return {
text(value) {
if (value === undefined) return element.text;
element.text = value;
return this;
},
click(callback) {
handlers[selector] = callback;
return this;
}
};
}
$(document).ready(function() {
$('#press').click(function() {
$('#title').text('Text Altered');
});
});
console.log($('#title').text());
handlers['#press']();
console.log($('#title').text());
Text
Text Altered
在浏览器中，可以将处理函数用于 <p id="title">Text</p> 和 <button id="press">Text Change</button>，并确保在脚本运行前已加载 jQuery。段落起初显示“Text”；点击按钮后会变为“Text Altered”。选择器中的 ID 必须与页面元素的 ID 一致，这样处理函数才能更新目标段落。
