jquery插入兄弟节点的操作方法

功能：插入指定元素到父元素的第一个位置(最左边)

实例

$self.prepend($selectLi);

解释

self是selectLi的父元素,把self放在selectLi的最前面(最左边),

移动的是selectLi,

append

功能：插入指定元素到父元素的最后面(最右边)

after

实例

$firstLi.after($selectLi);

解释

把selectLi放在firstLi的后面(右边),

移动的是selectLi

注意：selectLi和firstLi 是兄弟节点

next

功能：获取下一个兄弟节点,

与之功能相反的是prev

实例

while($selectLiYears>firstLiYears){
      $firstLi=$firstLi.next();
      hasExpandClicked=true;
      firstLiYears=$firstLi.data('years');
    }

解释

获取下一个兄弟节点

获取指定索引的子元素

实例

var $selectLi=$self.find('li:nth-child('+(srcIndex)+')');
var $firstLi=$self.find('li:first');
$("p:nth-child(3)")

 解释

:first表示获取第一个元素,
:last表示获取最后一个元素,
nth-child(2)表示获取第2个元素

以上这篇jquery插入兄弟节点的操作方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • jquery的父、子、兄弟节点查找,节点的子节点循环方法

    jQuery.parent(expr)           //找父元素 jQuery.parents(expr)          //找到所有祖先元素,不限于父元素 jQuery.children(expr)        //查找所有子元素,只会找到直接的孩子节点,不会返回所有子孙 jQuery.contents()            //查找下面的所有内容,包括节点和文本. jQuery.prev()                //查找上一个兄弟节点,不是所有的兄弟节点 jQue

  • jquery的父子兄弟节点查找示例代码

    jQuery.parent(expr) 找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(".class") jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素 jQuery.children(expr).返回所有子节点,这个方法只会返回直接的孩子节点,不会返回所有的子孙节点 jQuery.contents

  • jQuery获取父元素节点、子元素节点及兄弟元素节点的方法

    本文实例讲述了jQuery获取父元素节点.子元素节点及兄弟元素节点的方法.分享给大家供大家参考,具体如下: 先来看这段html代码,整个取节点(父.子.兄弟等)的方法都是围绕这段代码来的: <ul class="par"> <li id="firstli"> <h3 class="title">条目一</h3> <ul class="par"> <li id=&

  • jquery插入兄弟节点的操作方法

    功能:插入指定元素到父元素的第一个位置(最左边) 实例 $self.prepend($selectLi); 解释 self是selectLi的父元素,把self放在selectLi的最前面(最左边), 移动的是selectLi, append 功能:插入指定元素到父元素的最后面(最右边) after 实例 $firstLi.after($selectLi); 解释 把selectLi放在firstLi的后面(右边), 移动的是selectLi 注意:selectLi和firstLi 是兄弟节点

  • JQuery插入DOM节点的方法

    本文实例讲述了JQuery插入DOM节点的方法.分享给大家供大家参考.具体分析如下: 动态创建HTML元素并没有实际用处,还需要将新创建的元素插入文档中.将新创建的节点插入文档最简单的办法是,让它成为这个文档的某个节点的子节点.前面使用了一个插入节点的方法append(),它会在元素内部追加新创建的内容. 将新创建的节点插入某个文档的方法并非只有一种,在JQuery中还提供了其他儿种插入节点的方法,如下表所示.读者可以根据实际需求灵活地做出多种选择. HTML DOM结构如下: <p class

  • 有关jquery与DOM节点操作方法和属性记录

    有关jquery与DOM节点操作方法和属性记录

    网上找了份jquery的操作节点方法清单.如下: 方法 源包装集/字串 目标包装集体 特性描述 A.append(B) B A 若目标包装集只匹配一个元素,则源(也包括同源包装集匹配的所有元素)将被移动到目标位置:若目标包装集包含多个元素,则源将保留在原来的位置,但同时复制一份相同的副本到目标位置. 由此,若目标只匹配一个元素时,使用前述方法后源将被删除. B.appendTo(A) A.prepend(B) B.prependTo(A) A.before(B) B.insertBefore(A

  • jQuery中 DOM节点操作方法大全

    append(content | fn):向每个匹配的元素内部追加内容.参考:http://jquery.cuishifeng.cn/append.html 例如:向所有段落中追加一些HTML标记. <p>I would like to say: </p> $("p").append("<b>Hello</b>"); [ <p>I would like to say: <b>Hello</

  • Jquery对新插入的节点 绑定Click事件失效的解决方法

    1.有人说用 Live, 事实上现在最新的Jquery已经不支持 Live 了.live的解决方法如下: 你可以看这个 也可以不看 ,只是做到心中有数就可以了.下面介绍ON的方法. live:Live的使用介绍 2.有人用了ON 来解决, 这个解决方法基本在理. On :On的介绍,能解决问题 On的方法,基本能解决问题,但是你也要根据你的具体情况做选择.并不是每个人的代码都像上面这个案例描述的那么简单.但是万变不离其宗. 我是这样来做的,最终把问题解决了. 我有一个UL 标签是静态的,就是说不

  • jquery 删除节点 添加节点 找兄弟节点的简单实现

    $().empty(); //该方法会删除当前节点下的所有子节点,请注意当前节点不会 被删除 $().remove(); //该方法会删除当前节点下的所有子节点,请注意 当前节点会  被删除 $().append('<a>something</a>')  //该方法在当前节点的末尾 添加 这个a标签 $().after('<span style="font-family: Arial, Helvetica, sans-serif;"><a>

  • jQuery插入节点和移动节点用法示例(insertAfter、insertBefore方法)

    jQuery插入节点和移动节点用法示例(insertAfter、insertBefore方法)

    本文实例讲述了jQuery插入节点和移动节点的方法.分享给大家供大家参考,具体如下: 1. 插入节点: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="js/jquery-1.10.1.min.js" ty

  • JS实现DOM节点插入操作之子节点与兄弟节点插入操作示例

    JS实现DOM节点插入操作之子节点与兄弟节点插入操作示例

    本文实例讲述了JS实现DOM节点插入操作之子节点与兄弟节点插入操作.分享给大家供大家参考,具体如下: <!doctype html> <html> <head> <meta charset="utf-8"> <title>www.jb51.net JS节点插入</title> <script> function showinsert(){ //添加子节点 var str=document.getElem

随机推荐