jquery $ html

jQuery 的 $ 和 html() 方法

jQuery 是一个流行的 JavaScript 库，简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。$ 是 jQuery 的核心符号，html() 是用于操作 HTML 内容的方法。

$ 符号的作用

$ 是 jQuery 的别名，用于访问 jQuery 的功能。它通常用于选择 DOM 元素或创建 jQuery 对象。例如：

// 选择所有 <p> 元素
$("p").css("color", "red");

html() 方法的功能

html() 方法用于获取或设置元素的 HTML 内容。它可以读取或修改元素的内部 HTML。

获取 HTML 内容

var content = $("#myDiv").html();
console.log(content); // 输出 #myDiv 内的 HTML

设置 HTML 内容

$("#myDiv").html("<p>新的内容</p>");

链式操作 html() 可以与其他 jQuery 方法链式调用：

$("#myDiv").html("<p>新内容</p>").addClass("updated");

注意事项

• html() 会覆盖元素内所有现有内容。
• 使用 text() 方法可以安全地插入纯文本，避免 XSS 攻击。
• 空参数调用 html() 会返回内容，带参数则设置内容。

示例代码

// 获取并设置 HTML
$("#button").click(function() {
  var oldHtml = $("#container").html();
  $("#container").html(oldHtml + "<p>追加的内容</p>");
});

通过结合 $ 和 html()，可以高效地动态更新页面内容。