jQuery添加标签属性
("div").attr("class"); // 返回文档中所有div元素的class属性值
$("div").attr("class","box"); // 设置所有div的class属性值为box
$("div").removeAttr("class"); // 删除文档中所有div的class属性 (不建议使用)
$("img").removeProp("src"); // 删除img的src属性 (建议使用)
//attr属性 prop是特性 属性是包含特性的,特性关注的是状态
// prop针对的是表单元素的 checked selected disabled
$("input[type='checkbox']").prop("checked", true); // 选择所有被选中的复选框
$("input[type='checkbox']").prop("checked", false); // 选择所有没被选中的复选框
jQuery添加标签class
$("div").addClass("selected"); // 为div元素加上class为 'selected' 类
$("div").removeClass("selected"); // 从div元素中删除class为 'selected' 类
$("div").toggleClass("selected"); // 如果存在就删除,否则就添加
HTML获取值和写入信息操作
//.html()是用来读取元素的html内容(包括html标签);
//.text()用来读取元素的纯文本内容,包括其后代元素;
//.val()是用来读取表单元素的”value”值;
$('p').html(); // 返回p元素的html内容
$("p").html("<b>123</b>!"); // 设置p元素的html内容
$('p').text(); // 返回p元素的文本内容
$("p").text("123"); // 设置p元素的文本内容
$("input").val(); // 获取文本框中的值
$("input").val("123"); // 设置文本框中的内容
jQuery对文档的处理
内部插入:
//append,prepend如果在添加的时候想要改变添加元素的样式等东西是不行的因为这样添加操作的是前面的元素不是被添加的元素如果想要更改可以使用appendTo,prependTo。
$("p").append("<b>123</b>"); // 在每个p元素内的最后面追加内容
$("<b>123</b>").appendTo("p"); // 将内容追加到p元素的最后面
$("p").prepend("<b>123</b>"); // 在每个p元素内的最前面追加内容
$("<b>123</b>").prependTo("p"); // 将内容追加到p元素的最前面</pre>
外部插入:
$("div").after("123"); // 在同级div元素的最后插入内容
$("div").before("123"); // 在同级div元素的最前面插入内容
$("p").insertAfter("#box"); // 所有p元素插入到id为box元素的后面
$("p").insertBefore("#box"); // 所有p元素插入到id为box元素的前面
替换:
$("p").replaceWith("<b>123</b>"); // 将匹配到的所有p元素替换成<b>123</b>(可以是文档内容和标签元素)
$("<b>123</b>").replaceAll("p"); // 将元素或内容替换给所有选中的p元素
删除:
$("div").empty(); // 删除匹配的div元素中所有的子节点,不包括本身
$("div").remove(); // 删除所有匹配的元素,包括本身
$("div").detach(); // 删除所有匹配的元素(和remove()不同的是:所有绑定的事件、附加的数据会保留下来)
复制:
$("p").clone(); // 生成被选元素的副本,包含子节点、文本和属性
$("p").clone(true); // 可选,布尔值,规定是否复制元素的所有事件处理,默认地,副本中不包含事件处理器。
//就是如果复制过来的元素如果本身含有事件,参数为false的时候是不能复制过来的,复制过来的元素里面不含有,默认是false,true是可以把事件复制过来。