在 jQuery 中，可以使用 .text() 或 .html() 方法来设置 <span> 元素的值。以下是一些示例：
使用 .text() 方法
.text() 方法用于设置或获取元素的文本内容。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Set Span Value</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<span id="mySpan">Original Text</span>
<button id="changeTextButton">Change Text</button>
<script>
$(document).ready(function(){
$("#changeTextButton").click(function(){
$("#mySpan").text("New Text");
});
});
</script>
</body>
</html>
这个例子中，当点击按钮时，<span> 元素的内容会被设置为 "New Text"。
使用 .html() 方法
.html() 方法不仅可以设置文本内容，还可以插入 HTML 标签。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Set Span Value</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<span id="mySpan">Original Text</span>
<button id="changeHtmlButton">Change HTML</button>
<script>
$(document).ready(function(){
$("#changeHtmlButton").click(function(){
$("#mySpan").html("<strong>New Text</strong>");
});
});
</script>
</body>
</html>
在这个例子中，当点击按钮时，<span> 元素的内容会被设置为包含加粗文本的 HTML 代码。
总结
- 使用
.text()方法可以安全地设置纯文本内容。 - 使用
.html()方法可以设置包含 HTML 标签的内容。
选择哪种方法取决于你具体的需求。