jqueryhtml方法 jQuery html() 方法

jqueryhtml方法

jQuery html() 方法用于设置或返回被选元素的内容（innerHTML）。

$(selector).html(content);  // 设置被选元素的内容
$(selector).html();  // 返回被选元素的内容

当使用 html() 方法时，如果没有参数，则返回被选元素的当前内容。如果使用了参数，则会将参数作为新的内容来设置被选元素。

html() 方法可以用来替代 innerHTML 属性。但是，与 innerHTML 属性不同，html() 方法不会返回文本和注释节点。

  // 返回 
This is a test
 的内容 
$("#test").html();   // "This is a test"  

除了字符串外，html() 方法也可以接受一个函数作为参数。该函数将在每个匹配元素上执行，并将当前元素作为上下文传递。函数必须返回一个字符串来作为新的 HTML 内容。

// 在所有 
 元素中加上 "Example" 链接 
$("div.example").html(function(){   return "Example" }); 

此外，jQuery 还提供了一些特殊的 html 方法来处理 HTML 结构中特定的部分：text()、val()、append()、prepend()、after()、before()、wrap() 等方法都是基于 html() 来实现的。

jQuery html() 方法

jQuery html() 方法

jQuery HTML/CSS 方法

实例

改变所有 <p> 元素的内容：

$("button").click(function(){
$("p").html("Hello <b>world</b>!");
});

---

定义和用法

html() 方法设置或返回被选元素的内容（innerHTML）。

当该方法用于返回内容时，则返回第一个匹配元素的内容。

当该方法用于设置内容时，则重写所有匹配元素的内容。

提示：如只需设置或返回被选元素的文本内容，请使用 text() 方法。

---

语法

返回内容：

$(selector).html()

设置内容：

$(selector).html(content)

使用函数设置内容：

$(selector).html(function(index,currentcontent))

参数	描述
content	必需。规定被选元素的新内容（可包含 HTML 标签）。
function(index,currentcontent)	可选。规定返回被选元素的新内容的函数。 index - 返回集合中元素的 index 位置。 currentcontent - 返回被选元素的当前 HTML 内容。

---

更多实例

返回元素内容
如何返回元素的内容。

使用函数设置元素内容
使用函数来设置所有被选元素的内容。

---

jQuery HTML/CSS 方法