append、appendTo、appendChild、prepend

最新推荐文章于 2025-04-03 12:06:16 发布

章柏华

最新推荐文章于 2025-04-03 12:06:16 发布

阅读量8k

点赞数

分类专栏： javascript

本文链接：https://blog.youkuaiyun.com/qingzhifeng_123/article/details/53781518

版权

javascript 专栏收录该内容

7 篇文章

订阅专栏

本文详细介绍了DOM操作中的各种方法，包括append、appendTo、appendChild等用于在父节点中插入新节点的方法，以及after、insertAfter、before、insertBefore等用于在指定元素前后插入新节点的方法。此外还介绍了innerHTML和innerText等替换元素内容的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

参考资料：http://blog.youkuaiyun.com/xiangxiangw29/article/details/52460563

append、appendTo、appendChild、在父节点中的最后一个子节点后面插入。append和appendTo区别是append的前面是对象，后面是要插入的节点对象。

比如append var wrap=document.getElementById('wrap'); wrap.append('<p>111111</p>');

而 appendTo $('<p>1111</p>').appendTo($('wrap'));

appendChild 是JS方法，和append一样，插入到父节点中最后一个子节点之后。

上面的都是在插入父元素中的子节点最后。

prepend、prependTo

上面两个的都是在插入父元素中的子节点最前面。

after 、insertafter

上面两个的都是在插入当前元素之后。

before 、insertbefore

上面两个的都是在插入当前元素之前。

innerHTML是把当前内容都换掉，是JS原生方法，可以写入元素节点。用法 DOM.innerHTML='<p>1111222</p>';

innerTEXT是把当前内容都换掉，是JS原生方法，可以写入元素节点。用法 DOM.innerText='<p>1111222</p>';
jquery方法是html()和text();