jQuery插入节点的方法

最新推荐文章于 2023-06-16 19:59:01 发布
最新推荐文章于 2023-06-16 19:59:01 发布
阅读量6.5k 收藏 17
点赞数 1
分类专栏： 前端开发 文章标签： jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wujunlei1595848/article/details/93222670
版权
方法描述示例
append()向每个匹配的元素内部追加内容

HTML代码:

<p>我想说：</p>

jQuery代码:

$("p").append("<b>你好</b>");

结果:

<p>我想说：<b>你好</b></p>

appendTo()将所有匹配的元素追加到指定元素中，实际上，使用该方法是颠倒了常规的$(A).append(B)的操作，即不是将B追加到A中，而是将A追加到B中

HTML代码：

<p>我想说:</p>

jQuery代码:

$("<b>你好</b>").appendTo("p");

结果:

<p>我想说：<b>你好</b></p>

prepend()向每个匹配的元素内部前置内容

HTML代码：

<p>我想说：</p>

jQuery代码：

$("p").prepend("<b>你好</b>");

结果：

<p><b>你好</b>我想说：</p>

prependTo()将所有匹配的元素前置到指定的元素中。实际上，使用该方法是颠倒了常规的$(A).prepend(B)的操作，即不是将B前置到A中，而是将A前置到B中

HTML代码：

<p>我想说：</p>

jQuery代码:

$("<b>你好</b>").prependTo("p");

结果:

<p><b>你好</b>我想说：</p>

after()在每个匹配的元素之后插入内容

HTML代码：

<p>我想说：</p>

jQuery代码：

$("p").after("<b>你好</b>");

结果：

<p>我想说：</p><b>你好</b>

insertAfter()将所有匹配的元素插入到指定元素的后面。实际上，使用该方法是颠倒了常规的$(A).after(B)的操作，即不是讲B插入到A后面，而是将A插入到B后面

HTML代码：

<p>我想说：</p>

jQuery代码：

$("<b>你好</b>").insertAfter("p");

结果：

<p>我想说：</p><b>你好</b>

before()在每个匹配的元素之前插入内容

HTML代码：

<p>我想说：</p>

jQuery代码：

$("p").before("<b>你好</b>");

结果：

<b>你好</b><p>我想说：</p>

insertBefore()将所有匹配的元素插入到指定的元素的前面。实际上，使用该方法是颠倒了常规的$(A).before(B)的操作，即不是将B插入到A前面，而是将A插入到B前面

HTML代码：

<p>我想说：</p>

jQuery代码：

$("<b>你好</b>").insertBefore("p");

结果：

<b>你好</b><p>我想说：</p>

 

mannuandeyangguang
关注
  • 1
    点赞
  • 踩
  • 17
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
JQuery插入DOM节点的方法
10-24
主要介绍了JQuery插入DOM节点的方法,实例分析了jQuery实现DOM结点插入所涉及的常见函数使用技巧,需要的朋友可以参考下
css外链式和导入式的区别
Edward-W的博客
05-18 6522
外链式样式为&lt;link rel="stylesheet" href="css/test.css"&gt;导入式样式为@import "css/test.css";两者最先实现的结果是一样的，都是将独立的css文件引入到网页文件中。但是两者还是有细微的差别的。其中link是将css布局文件先加载如网页文件中，所以这时无论网速再慢，最终实现的网页效果都是一样的。而@import则是先将网页文件加...
jQuery 插入节点的方法
yzkdcsdn的博客
11-16 3118
jQuery 插入节点的方法 before(): 在指定节点的前面添加要添加的节点 insertBefore(): 把要插入节点插入到指定节点的前面 after (): 在指定节点的后面添加要添加的节点 insertAfter (): 把要插入的节点插入到指定节点的后面 prepend (): 在指定父级里面的最前面添加指定节点 prependTo (): 把指定节点添加到指定父级里面的最前面 append (): 在指定父级里面的最后面添加指定节点 appendTo (): 把指定节点添加到指定父级里面
jquery插入节点
qq_28596151的博客
05-23 1347
    jquery插入节点是一个非常有用的而且操作简单的功能点。在实际开发中我们难免会需要动态创建节点，用于展示我们的数据或者动态创建节点用于我们自己特有的业务。    jquery提供了好几个插入方法：append()、appendTo()、prepend()、prependTo()、after()、insertAfter()、before()、insertBefore()。下面我们一一讲解这...
JQuery插入节点方法
kq975的博客
03-01 1817
jQuery插入节点方法，共有以下4组。 （1）prepend()和prependTo() （2）append()和appendTo() （3）before()和insertBefore() （4）after()和insertAfter() 对于这4组方法，我们可以这样划分：第1组和第2组是“内部插入节点”；第3组和第4组是“外部插入节点”。上面每一组中，任意两种方法都是等价的。因此为了减轻记忆负担，我们只需要记住以下任何一类就可以了。 （1）第1类：prepend()、append()、before()、
标题jQuery添加节点的五种方式
weixin_73756660的博客
09-22 2389
分别是append, prepend, before ,after, appendTo append添加节点添加元素节点append（）与appendTo（）两种方法都是将元素追加到节点上 例如jQuery代码: $("p").append("你好"); prepend 而prepend（）方法Jquery元素节点向每个匹配的元素内部前置内容。 例如jQuery代码： $("p").prepend("你好"); before before():在指定节点的前面添加要添加的节点 例如b
jquery插入兄弟节点的操作方法
11-29
功能：插入指定元素到父元素的第一个位置(最左边) 实例 $self.prepend($selectLi); 解释 self是selectLi的父元素,把self放在selectLi的最前面(最左边), 移动的是selectLi, append 功能：插入指定元素到父元素的最...
jQuery插入节点1
08-08
jQuery插入节点1
jQuery:插入,复制,替换和删除节点
weixin_34179968的博客
03-04 96
<html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>jQuery插入,复制、替换和删除节点</title><script type="text/javascript" src="jquery-1...
jquery 添加节点的几种方法介绍
01-19
代码如下: <html> <head> <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″> <title>jQuery插入,复制、替换和删除节点</title> [removed][removed] [removed] $(document).ready(function(){ //几种添加节点的方法 //$(“p”).append(“<b>你好吗？</b>”);//向p元素中追加
jquery插入节点的几种方法总结
daylight_1的专栏
07-31 2601
jquery插入节点的方法
JQuery添加节点的几种方法
灬老夏灬
04-12 1103
jQuery插入,复制、替换和删除节点 $(document).ready(function(){ //几种添加节点的方法 //$("p").append("你好吗？");//向p元素中追加《b》 //$("你好吗？").appendTo("p");//将《b》追加到p元素中 //$("p").prepend("你好吗？");//向p中前置《b》
jQuery添加节点的五种方式
weixin_43799793的博客
02-20 2329
标题jQuery添加节点的五种方式 append, prepend, before ,after, appendTo <script src="jquery-1.12.4.js"></script> <script> $(function () { //1.append(); //父元素.append(子元素); //...
jQuery之添加节点的几种方式
最新发布
06-16 2716
/ 1、获取一个li节点// 2、把这个li标签剪切复制到ul中作为最后一个子元素。
jquery节点添加
m0_57727153的博客
03-27 1195
添加元素节点append（）与appendTo（）两种方法都是将元素追加到节点上 而 prepend（）方法Jquery元素节点向每个匹配的元素内部前置内容。 这是向所有匹配元素内部的开始处插入内容的最佳方式。 参数： 1.HTML代码 2.向id为“wrapper”的div中添加节点123 3.实现结果 同理：perpendTo（）方法是把所有匹配的元素前置到另一个、指定的元素元素集合中。 实际上，使用这个方法是颠倒了常规的$(A).prepend(B)的操作，即不是把B前
JQ 添加节点和插入节点的方法总结
weixin_30514745的博客
02-28 244
转载来源：http://blog.csdn.net/ss1106404013/article/details/49274345 添加节点的jQuery方法：append()、prepend()、appendTo() 、prependTo() 插入节点的jquery方法：after() 、before() 、insertBefore() 、insertAfter() 举个例子来说明以上几种...
JS和jQuery插入节点的代码示例
05-31
以下是在JavaScript和jQuery中插入节点的代码示例： JavaScript代码示例： ```javascript // 创建新的元素 var newElement = document.createElement('p'); newElement.textContent = '这是一个新的段落'; // ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

mannuandeyangguang

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值