创建添加节点:

  创建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. c#中快速排序的学习

    最近看了一句话,说的是在现实生活中,会写字的人不见得会写出好文章,学习编程语言就像是学会了写字,学会了编程语言并不一定能写出好程序. 我觉得就是很有道理,以前读书的时候,基本学完了C#中的语法知识,算 ...

  2. C#解密退款req_info结果通知

    微信支付退款结果通知API地址:https://pay.weixin.qq.com/wiki/doc/api/native.php?chapter=9_16&index=10 static v ...

  3. 简谈Entity Framework的优缺点

    Entity Framework简介 Entity Framework的全称为 ADO.NET Entity Framework ,简称为EF, 是微软以ADO.NET为基础发展出来的实体框架,早期被 ...

  4. appium精简教程

    环境配置 package appium; import io.appium.java_client.android.*; import java.io.File; import java.io.IOE ...

  5. Android开发重点难点:RelativeLayout(相对布局)详解

    https://i.cnblogs.com/EditPosts.aspx?opt=1 重点知识 和线性布局(LinearLayout)一样,RelaiveLayout相对布局也是我们用的比较多的一个布 ...

  6. SQL高效查询两个表不同的数据

    逻辑相对复杂,但是速度最快: )

  7. Liferay开发实战(2):Service Builder生成持久化层,及开发服务层

    本文Liferay适用版本:v6.2.ce-ga6版 Liferay的插件体系是:模型-视图-控制器的portlet MVC框架.MVC是一个伟大的用于Web应用程序的设计模式,在实际应用中还应处理持 ...

  8. flask开发微信公众号

    1.进入微信公众号首页,进行注册登录 https://mp.weixin.qq.com/ 2.进入个人首页,进行公众号设置 可参照 公众号文档 进行开发 开发前 先阅读 接口权限列表 3.配置服务器 ...

  9. redis常用命令(二)

    一.集合(set) 单值多value,vaue不能重复 sadd/smembers/sismember 添加数据/获取set所有数据/判断是否存在某个值 scard 获取集合里面的元素个数 srem ...

  10. json-lib.jar开发包及依赖包的下载地址(转)

    一.去官方下载json-lib工具包下载地址:http://sourceforge.net/projects/json-lib/files/json-lib/json-lib-2.4/目前最新的是2. ...