创建添加节点:

  创建jquery对象:$("<a href="http://baidu.com" target="_blank">百度请点击我</a>");

  append:添加节点到子元素的最后面        $("div").append($("p"));{找到div元素,在div元素的最后面添加一个p元素}

  prepend:添加节点到子元素的最前面   $("div").prepend($("p"));{找到div元素,在div元素的最前面添加一个p元素}

  appendTO:将子元素添加到父元素的最后面  $("p").appendTo($("div"));{将p元素添加到div元素的最后面}

  prependTo:将子元素添加到父元素的最前面          $("p").prependTO($("div")); {将p元素添加到div元素的最前面

  after:将一个元素添加到另一个元素的后面,作为同级元素(兄弟元素平级的)

  before:将一个元素添加到另一个元素的前面,作为同级元素(兄弟元素平级的)

  

<div class="box">
我是div中的元素
</div>
<p>我是外面的p1元素</p>
<p>我是外面的p2元素</p>
<p>我是外面的p3元素</p>
<p>我是外面的p4元素</p>
<p>我是外面的p5元素</p>
<script>
//在div元素的后面添加一个a元素并且点击能跳转百度
var $a=$('<a href="www.baidu.com" target="_blank">点击我</a>');
console.log($a)
$("div").append($a); //将p2元素添加到div元素的最后面
$("p").eq().appendTo("div");
//将p3 p4元素添加到div元素的最前面
$("p").eq().prependTo("div");
var $b=$("p").eq();
$("div").prepend($b);
</script>

  

  删除节点与清空节点

    empty();清空一个元素中的所有内容包括事件。     html("");也可以清空内容,但是不要这么写,会内容泄露(他会把元素中的元素添加一个”“的内容)

    remove();移除元素

    clone();克隆元素,不传参数也是深度复制   如果传递true 也是深度复制,元素的事件也会克隆,false则不会   默认为false。

<div class="box">
我是div中的元素
</div>
<p>我是外面的p1元素</p>
<p>我是外面的p2元素</p>
<p>我是外面的p3元素</p>
<p>我是外面的p4元素</p>
<p>我是外面的p5元素</p>
<script>
//删除p5元素节点
$("p").eq().remove();
//克隆p4元素节点到div元素节点的最后面
$("p").eq().clone().appendTo($("div"));
//清空div所有元素节点
$("div").empty(); </script>

    

Jquey节点操作的更多相关文章

  1. 深入理解DOM节点操作

    × 目录 [1]创建节点 [2]插入节点 [3]移除节点[4]替换节点[5]复制节点 前面的话 一般地,提起操作会想到“增删改查”这四个字,而DOM节点操作也类似地对应于此,接下来将详细介绍DOM的节 ...

  2. 深入学习jQuery节点操作

    × 目录 [1]创建节点 [2]插入节点 [3]删除节点[4]复制节点[5]替换节点[6]包裹节点 前面的话 DOM节点操作包括创建节点.插入节点.移除节点.替换节点和复制节点.jQuery也有类似的 ...

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

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

  4. 第6章 DOM节点操作

    一.创建节点 为了使页面更加智能化,有时我们想动态的在 html 结构页面添加一个元素标签,那么 在插入之前首先要做的动作就是:创建节点. varbox=$('<div id="box ...

  5. js节点操作

    在看<javascript高级程序设计>,看到节点操作这一块,觉得我只知道用appendChild(),太肤浅了,记录下学到的东西. 每个节点都有一个 parentNode 属性,该属性指 ...

  6. js 节点 document html css 表单节点操作

    js 节点 document html css 表单节点操作 节点操作:访问.属性.创建 (1)节点的访问:firstChild.lastChild.childNodes.parentChild(父子 ...

  7. ligerui_ligerTree_004_对"ligerTree"节点操作

    ligerTree节点操作: 源码地址:http://download.csdn.net/detail/poiuy1991719/8571255 效果图: 代码: json.txt: [ { text ...

  8. ext 树节点操作

    ext 树节点操作 tree :树    node:节点 1.全部展开 tree.expandAll(); 2.全部收缩 tree.collapseAll(); 3.得到父节点 node.parent ...

  9. cocos2d-x 节点操作 -->J2ME

      cocos2d-x 的节点操作涉及到以下几点          1.  节点之间的关系          2.  节点的添加操作          3.  节点的删除操作          4.  ...

随机推荐

  1. MD5状态变量,为什么是A=0x67452301,B=0xefcdab89,C=0x98badcfe,D=0x10325476这几个变量

    找到过一篇答复: 3.3 Step 3. Initialize MD Buffer A four-word buffer (A,B,C,D) is used to compute the messag ...

  2. jquery基于form-data文件上传

    1.html代码 <input type="file" name="myupdate" id="myupdate"> 2.jav ...

  3. dev gridview自动列宽和单元、行、checkbox选中和多选

    #region 自动列宽 for (int I = 0; I < gridView1.Columns.Count; I++) { this.gridView1.BestFitColumns(); ...

  4. 在windows10上创建ASP.NET mvc5+Memcached服务

    感谢两位两位大佬: https://blog.csdn.net/l1028386804/article/details/61417166 https://www.cnblogs.com/running ...

  5. ionic 2.x 3.x项目结构解析

    myApp │ config.xml //项目配置文件,包名.名称.minSdkVersion等都在此处配置 │ ionic.config.json │ package.json //项目依赖文件列表 ...

  6. 关于css中float的理解

    感觉css里的float是个非常神奇的东西,神奇之处在于,你知道它是什么意思,但是用的时候总是不知道怎么实现效果.又或者它会很容易地影响到别的元素和属性.所以今天打算尝试一下float的各种设置,看看 ...

  7. 【计算机网络】网络层学习笔记:总结IP,NAT和DHCP

    前言:这篇文章是学习网络层协议时候总结的笔记,前面的主要部分介绍的都是IP协议, 后半部分介绍NAT协议和DHCP协议 参考书籍 <计算机网络-自顶向下>       作者 James F ...

  8. 【文文殿下】 [SDOI2013]保护出题人 题解

    题解 我们把伤害-时间图像画出来.然后维护一下僵尸血量的前缀和.最好情况肯定是有一个僵尸恰好死在戴夫家门口.我们把原点到其他n个点的斜率最大的一个累积到答案. 发现每添加一个点,其他所有点的坐标都变了 ...

  9. Django(命名URL和URL反向解析)

    day67 参考: https://www.cnblogs.com/liwenzhou/articles/8271147.html#autoid-1-4-0 反向解析URL             本 ...

  10. js DOM 案例

    模态框 <html> <head> <meta charset="UTF-8"> <title>模态框</title> ...