jquery增加属性

使用 attr() 方法增加属性

attr() 是 jQuery 中用于获取或设置属性值的方法。通过传递属性名和值，可以为元素动态添加属性。

// 为元素添加单个属性  
$("#elementId").attr("data-custom", "value");  

// 同时添加多个属性  
$("#elementId").attr({  
    "data-role": "button",  
    "disabled": "disabled"  
});  

使用 prop() 方法增加布尔属性

对于布尔属性（如 disabled、checked），推荐使用 prop() 方法。

// 添加布尔属性  
$("#checkbox").prop("checked", true);  
$("#button").prop("disabled", true);  

使用 data() 方法添加自定义数据属性

data() 方法专门用于操作 data-* 属性，数据会存储到 jQuery 的内部数据缓存中。

// 添加 data-* 属性  
$("#element").data("key", "value");  
// 获取时无需 "data-" 前缀  
console.log($("#element").data("key")); // 输出 "value"  

动态添加属性到新创建的元素

在创建元素时直接通过对象传递属性。

// 创建带属性的元素  
$("<div>", {  
    id: "dynamicDiv",  
    class: "highlight",  
    "data-info": "dynamic"  
}).appendTo("body");  

注意事项

• attr() 适用于标准 HTML 属性（如 id、class），而 prop() 更适合布尔属性。
• data() 方法会同步修改 DOM 的 data-* 属性，但优先访问 jQuery 内部缓存。
• 直接操作 DOM 属性（如 element.setAttribute()）可能与 jQuery 方法产生冲突，建议统一使用 jQuery 方法。