方法 描述 示例
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>

jquery 插入节点的方法的更多相关文章

  1. jQuery插入节点的方法

    注:摘自<锋利的jQuery(第二版)> append() 向每个匹配的元素内部追加内容:  HTML代码:<p>我想说:</p>jQuery代码:$(" ...

  2. jQuery插入节点(移动节点)

    jQuery插入节点(移动节点) <%@ page language="java" import="java.util.*" pageEncoding=& ...

  3. Query节点操作,jQuery插入节点,jQuery删除节点,jQuery Dom操作

    一.创建节点 var box = $('<div>节点</div>'); //创建一个节点,或者var box = "<div>节点</div> ...

  4. jQuery节点操作,jQuery插入节点,jQuery删除节点,jQuery Dom操作

    一.创建节点 1 var box = $('<div>节点</div>'); //创建一个节点,或者var box = "<div>节点</div& ...

  5. JQ 添加节点和插入节点的方法总结

    转载来源:http://blog.csdn.net/ss1106404013/article/details/49274345 添加节点的jQuery方法: append().prepend().ap ...

  6. JS中插入节点的方法appendChild和insertBefore的应用

    1.appendChild() 方法:可以向节点的子节点列表的末尾添加新的子节点.比如:appendChild(newchild)括号里可以是创建的标签var newchild = document. ...

  7. JS(JavaScript)插入节点的方法appendChild与insertBefore

    首先 从定义来理解 这两个方法: appendChild() 方法:可向节点的子节点列表的末尾添加新的子节点.语法:appendChild(newchild) insertBefore() 方法:可在 ...

  8. jquery 插入节点

    往某个元素内部的结尾添加 append() appendTo() append() <body> <button id="bt1">点击通过jQuery的a ...

  9. jQuery元素节点的插入

    jquery插入节点的的方法,总的来说有8种,但是只要学会了其中的两个就能理解全部了, 这里我们学习append()和appendTo()两个方法: append()方法是向元素的内部追加内容: &l ...

随机推荐

  1. JAVA Spring 面向切面编程 基本案例(AOP)

    < 1 > 配置文件 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns=&q ...

  2. 机器学习入门-线性判别分析(LDA)1.LabelEncoder(进行标签的数字映射) 2.LinearDiscriminantAnalysis (sklearn的LDA模块)

    1.from sklearn.processing import LabelEncoder 进行标签的代码编译 首先需要通过model.fit 进行预编译,然后使用transform进行实际编译 2. ...

  3. Nginx Windows 安装启动

    原文连接:http://tengine.taobao.org/book/appendix_c.html#nginxwindows 下载 Nginx是开源软件,用户可以访问 http://nginx.o ...

  4. 前端开发-5-HTML-总结

    1.总体 资源:https://www.processon.com/view/link/5ad1c2d0e4b0b74a6dd64f3c html head标签 title 显示网站的标题 meta ...

  5. Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象。

    Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象. 语法EDIT Object.defineProperty(obj, ...

  6. JAVA WEB开发中的资源国际化

    为什么要国际化? 不同国家与地区语言,文化,生活习惯等差异.在数字,时间,语言,货币,日期,百分数等的不同. 两个名词: I18N:即资源国际化,全称为Internationalization,因为首 ...

  7. Kotlin语言学习笔记(7)

    反射 // 反射 val c = MyClass::class val c2 = MyClass::class.java // 获取KClass的引用 val widget: Widget = ... ...

  8. Haskell语言学习笔记(58)Bifoldable

    Bifoldable class Bifoldable p where bifold :: Monoid m => p m m -> m bifold = bifoldMap id id ...

  9. zabbix3.2的server和zabbix-agent2.2怎么监控MySQL的办法

    zabbix官方支持监控MySQL,但直接使用默认的模板是不可用的,还需要经过额外的设置才可以使用.如果只需要对mysql数据库做简单的监控,zabbix自带的模板完全能够满足要求:如果有更高的需求那 ...

  10. drupal sql 源码解析query.inc 文件

    query.inc 文件: sql语句: $this->condition($field);1707 line public function condition($field, $value ...