jquery 设置值

jQuery 设置值的方法

jQuery 提供了多种方法来设置 HTML 元素的值，具体方法取决于元素的类型（如输入框、下拉框、文本区域等）。以下是几种常见的设置值的方式：

设置输入框的值

使用 val() 方法可以设置输入框（<input>）、文本区域（<textarea>）或下拉框（<select>）的值。

// 设置输入框的值
$("#inputId").val("新值");

// 设置文本区域的值
$("#textareaId").val("多行文本内容");

// 设置下拉框的值
$("#selectId").val("optionValue");

设置 HTML 内容

使用 html() 方法可以设置元素的 HTML 内容（包括标签）。

// 设置元素的 HTML 内容
$("#elementId").html("<strong>加粗文本</strong>");

设置纯文本内容

使用 text() 方法可以设置元素的纯文本内容（不解析 HTML 标签）。

// 设置元素的纯文本内容
$("#elementId").text("纯文本内容");

设置属性值

使用 attr() 方法可以设置元素的属性值。

// 设置元素的属性值
$("#elementId").attr("data-custom", "自定义值");

设置 CSS 样式

使用 css() 方法可以设置元素的 CSS 样式。

// 设置元素的 CSS 样式
$("#elementId").css("color", "red");

设置表单多个字段的值

如果需要一次性设置表单中多个字段的值，可以通过遍历或直接传递对象实现。

// 遍历表单字段设置值
$("input").each(function() {
    $(this).val("默认值");
});

// 通过对象设置多个字段的值
$("#formId").find("input").val("统一值");

注意事项

• val() 方法适用于表单元素（如 input、select、textarea），而 html() 和 text() 适用于普通元素（如 div、span）。
• 使用 html() 时，传入的内容会被解析为 HTML，而 text() 会直接作为纯文本显示。
• 如果需要设置多个属性，可以使用对象形式的 attr()：

$("#elementId").attr({
    "data-id": "123",
    "title": "提示信息"
});

通过以上方法，可以灵活地设置页面中各种元素的值和属性。