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. 浅谈最长上升子序列(LIS)

    一.瞎扯的内容 给一个长度为n的序列,求它的最长上升子序列(LIS) 简单的dp n=read(); ;i<=n;i++) a[i]=read(); ;i<=n;i++) ;j<i; ...

  2. CentOS7、REHL7的firewalld防火墙使用简单说明

    title: CentOS7.REHL7的firewalld防火墙使用简单说明 categories: Linux tags: - Linux timezone: Asia/Shanghai date ...

  3. Spark SQL历险记

    现在的spark sql编程通常使用scala api 以及 java api的方式,相比于直接使用 spark sql语句,spark api灵活很多,毕竟可以基于dataset以及rdd两种方式进 ...

  4. 什么是span?跨径

    研究zipkin时候,发现有个span的概念 https://segmentfault.com/a/1190000012342007

  5. pdf下载速度

  6. Nginx配置不当可能导致的安全问题

    Nginx配置不当可能导致的安全问题 Auther: Spark1e目前很多网站使用了nginx或者tenginx(淘宝基于Nginx研发的web服务器)来做反向代理和静态服务器,ningx的配置文件 ...

  7. 7#Java基本语句语法

    Java基本语句语法https://github.com/DuGuQiuBai/Java/blob/master/day03/day03%E6%80%BB%E7%BB%93.txt 1:位运算符(了解 ...

  8. nuxt 2

    原文出处: 

  9. Leetcode: Max Consecutive Ones II(unsolved locked problem)

    Given a binary array, find the maximum number of consecutive 1s in this array if you can flip at mos ...

  10. POJ 3162 bit区间查询最值+树形DP

    POJ 3162 『题目链接』POJ 3162 『题目类型』bit区间查询最值+树形DP ✡Problem: 一棵n个节点的树.wc爱跑步,跑n天,第i天从第i个节点开始跑步,每次跑到距第i个节点最远 ...