jquery 常用元素操作方法1

//在p元素内最后追加元素
$("p").append("<a>111<a/>");
$("<a>111<a/>").appendTo("p");
//结果
<p>xxxx<a>111<a/><p/>

//在p元素内最前追加元素
$("p").prepend("<a>111<a/>");
$("<a>111<a/>").prependTo("p");
//结果
<p><a>111<a/>xxxx<p/>

//在p元素后添加元素,同级
$("p").after("");
$("").insertAfter("p");
<p>xxxx<p/><a>111<a/>

//在p元素前添加元素,同级
$("p").before("<a>111<a/>");
$("<a>111<a/>").insertBefore("p");
<a>111<a/><p>xxxx<p/>

删除节点
//删除p节点
$("p").remove();
//删除p节点中id为p1的p节点
$("p").remove("[id='p1']");

//我也不知道具体杂用,不写
detach()

//清空p节点
$("p").empty();

//复制接点
$("li").clone(true).prependTo("ul");
在clone中加true表示复制节点包括事件,不加则只复制节点

//替换节点,两种写法意思一样
$("p").replaceWith('<div>xxxxxxxxxxx<div/>');
$("<div>xxxxxxxxxxx<div/>").replaceAll('p');

//包裹节点 用div把p包裹起来
$("p").wrap("<div><div/>");

//一次设置多个值
$("p").attr({});
//删除
$("p").removeAttr("name");

//替换class
$("p").attr("class","c1");
//追加class
$("p").addClass("c3");

//删除class
$("p").removeClass("c1 c3");
//删除所有class
$("p").removeClass();

//交替执行代码,一次执行一个
toggle(func,func,func...)
//交替切换class
toggleClass()

//数组赋值
$("[name='ckb']").val(['1','2','3']);

相关推荐