1. append & appendTo 的功能均为:在被选元素结尾(仍在元素内部)插入指定内容,但是内容和选择器的位置不同 

  (1) append()方法:

    //在id为element元素内部末尾插入<p>拼接的元素</p>

    $("#element").append("<p>拼接的元素</p>");

  (2) appendTo()方法:

     //在id为element元素内部末尾插入<p>拼接的元素</p>

    $("<p>拼接的元素</p>").appendTo("#element");

2. insertBefore & before & insertAfter & after

  (1) insertBefore() & before() 方法 :在被选元素前(元素外部)插入指定内容

     //在id为element的元素前插入<p>拼接的元素</p>

    $("<p>拼接的元素</p>").insertBefore("#element");

    注:如果指定内容是已存在的元素,它将从它的当前位置被移除,并被插入在被选元素之前。

     //在id为element的元素前插入<p>拼接的元素</p>

    $("#element").before("<p>拼接的元素</p>");

  (2) insertAfter() & after()方法:在被选元素后(元素外部)插入指定内容

    //在id为element的元素后插入<p>拼接的元素</p>

      $("<p>拼接的元素</p>").insertAfter("#element");

    注:如果指定内容是已存在的元素,它将从它的当前位置被移除,并被插入在被选元素之后。

    //在id为element的元素后插入<p>拼接的元素</p>

    $("#element").after("<p>拼接的元素</p>");

jQuery拼接HTML标签元素的更多相关文章

  1. jQuery中 对标签元素操作(2)

    一.属性操作 1.获取属性和设置属性 例如下jQuery代码: var $para=$("p");           //获取<p>节点 var p_txt=$par ...

  2. jQuery中 对标签元素操作(1)

    一:创建元素节点(添加) 创建元素节点并且把节点作为元素的子节点添加到DOM树上    append(): 在元素下添加元素    用法:$("id").append(" ...

  3. jQuery基础之获取和设置标签元素属性

    jQuery基础之获取和设置标签元素属性方法,如下图: 代码实现: <script src="JS/jquery-1.12.4.min.js"></script& ...

  4. jquery 选择器(name,属性,元素)大全

    jQuery 选择器大体上可分为:基本选择器.层次选择器.过滤选择器.表单选择器. 其中过滤选择器可以分为:简单过滤选择器.内容过滤选择器.可见性过滤选择器.属性过滤选择器.子元素过滤选择器.表单对象 ...

  5. jQuery中常用的元素查找方法

    $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素 $("div&q ...

  6. 浅析jQuery中常用的元素查找方法总结

    本篇文章是对jQuery中常用的元素查找方法进行了详细的总结和介绍,需要的朋友参考下   $("#myELement") 选择id值等于myElement的元素,id值不能重复在文 ...

  7. [jQuery]无法获取隐藏元素(display:none)宽度(width)和高度(height)的新解决方案

    在做茶城网改版工作的时候,又遇到一个新问题,我需要用jQuery写一个通过点击左右图标来翻阅图片的小插件,写好后测试可以正常运行,但是放到Tab中后发现只有第一个Tab中的代码能够正常运行,其它全部罢 ...

  8. jQuery选取和操纵元素的特点

    jQuery选取和操纵元素的特点 JavaScript选取元素 先来看看不用jQuery的时候我们是怎么处理元素选取的. JavaScript选取元素的时候,可以根据id获取元素,当id不存在的时候, ...

  9. jquery动态添加的元素不能直接应用事件方法的时候

    对于由 jQuery 动态生成的元素,如用 jQuery 给元素添加 class,或者直接添加一对 p 标签,不能直接绑定常用的事件,如 click.因为这些元素属于动态生成,除非采用 onclick ...

随机推荐

  1. 配置环境变量及jdk

    1.配置虚拟机nat默认为yes:cd  /etc/sysconfig/network-scripts/    ll(查看下面ifcfg文件名称)    vim ifcfg-eno16777736(按 ...

  2. Movavi Video Editor 15 Plus(视频编辑软件) 中文版

    Movavi Video Editor 15 Plus Mac版是Movavi系列中的一款视频编辑器,Movavi Video Editor Plus 15破解版提供了全面的视频功能,另外还支持为视频 ...

  3. python集合set相关操作

    定义: 1.不同元素组成 2.无序 3.集合中的元素必须是不可变类型 创建集合 1 s = {1,2,3,4,5,6,7,8} 1.定义可变集合 1 2 3 >>> set_test ...

  4. arcgis 画图工具

    arcgis 4.x系列JavaScript API在4.4及以前的版本对画图工具(Draw)是不支持的,自4.5版本后才提供Draw的类.相关连接:https://developers.arcgis ...

  5. egg.js异步请求数据

    之前已经简单的使用egg-init初始化项目,并创建控制器controller和服务service 在实际项目中, service主要负责数据的请求,并处理(http请求) controll主要负责获 ...

  6. nuget包管理nuget服务器发布包时出现请求报错 406 (Not Acceptable)

    在window服务器上部署nuget服务器时,发布包时出现请求报错 406 (Not Acceptable) 验证用户名.密码正确的情况下,还是出现上面错误.后面跟踪服务器日志,发现window\te ...

  7. centos7 lamp

    yum install libmcrypt libmcrypt-devel mcrypt mhash zlib zlib-devel libpng libpng-devel freetype free ...

  8. YEP_fpssynchoption

    帧率调节插件 ============================================================================Introduction===== ...

  9. Linux基础命令---uname显示计算机名称

    uname uname指令用来显示计算机硬件以及操作系统的相关信息,例如计算机名.内核版本.硬件架构. 此命令的适用范围:RedHat.RHEL.Ubuntu.CentOS.Fedora.SUSE.o ...

  10. mysql数据库优化之索引的维护和优化

    这里是一个工具,即pt-duplicate-key-checker工具 用来检查重复及冗余的索引 用法如下:pt-duplicate-key-checker  -uroot  -p密码  -h127. ...