jquery 进行dom操作

Posted 2020-09-09 0101无限的空间

1.使用jqury进行dom操作

（1）.新建节点 使用$()包住即可返回值是jquery对象

var $liNode=$("<li></li>")

(2).把节点插入到文档中的8个方法

1.append,appendTo    这两个方法是插入到文档的末尾，注意append的左边是要被插入的对象，其他的同理可知

2.pretend,pretendTo  插入到文档的头

3.insertAfter,after   插入到文档的后面

4.insertBefore,before  插入到文档的前面

（3）.删除节点

a.remove();a被清除

(4)清空节点

a.empty();a被清空

（5）克隆节点

//在红警的下面game中克隆北京
$(‘#game li:first‘).after($(‘#a1‘).clone(true).attr("id","a2"));

（6）替换节点

//创建一个字节点替换游戏中的红警节点
$("<li>景德镇</li>").replaceAll($(‘#game li:first‘));
$(‘#a1‘).replaceWith($("<li>景德镇</li>"))

 

注意：由于replaceAll和replaceWith的返回值不同建议优先使用replaceWith()方法

var $bj= $(‘#a1‘).clone();
//红警被北京替换掉
var $h=$(‘#h‘).replaceWith($bj);
//背静替换红警；

$(‘#a1‘).replaceWith($h);

（7）.val() html().text(),attr(),width(),height()都具有读写的方法;