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


Posted in Javascript onDecember 07, 2016

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

实例

$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插入兄弟节点的操作方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
window.open的页面如何刷新(父页面)上层页面
Dec 28 Javascript
JavaScript网页定位详解
Jan 13 Javascript
基于javascript、ajax、memcache和PHP实现的简易在线聊天室
Feb 03 Javascript
JQuery显示隐藏页面元素的方法总结
Apr 16 Javascript
js实现键盘上下左右键选择文字并显示在文本框的方法
May 07 Javascript
浅谈JavaScript变量的自动转换和语句
Jun 12 Javascript
关于jquery中动态增加select,事件无效的快速解决方法
Aug 29 Javascript
基于JavaScript实现图片剪切效果
Mar 07 Javascript
Bootstrap页面标题Page Header的实现方法
Mar 22 Javascript
JavaScript根据json生成html表格的示例代码
Oct 24 Javascript
vue+moment实现倒计时效果
Aug 26 Javascript
js实现坦克大战游戏
Feb 24 Javascript
Bootstrap基本样式学习笔记之表格(2)
Dec 07 #Javascript
jquery的父、子、兄弟节点查找,节点的子节点循环方法
Dec 07 #Javascript
Bootstrap学习笔记之环境配置(1)
Dec 07 #Javascript
Bootstrap风格的WPF样式
Dec 07 #Javascript
Bootstrap基本组件学习笔记之导航(10)
Dec 07 #Javascript
Bootstrap基本组件学习笔记之input输入框组(9)
Dec 07 #Javascript
详解ES6中的let命令
Apr 05 #Javascript
You might like
详解WordPress中用于合成数组的wp_parse_args()函数
2015/12/18 PHP
php实现的中秋博饼游戏之绘制骰子图案功能示例
2017/11/06 PHP
基于laravel-admin 后台 列表标签背景的使用方法
2019/10/03 PHP
laravel 框架实现无限级分类的方法示例
2019/10/31 PHP
javascript下过滤数组重复值的代码
2007/09/10 Javascript
jQuery下的动画处理总结
2013/10/10 Javascript
多种方法实现JS动态添加事件
2013/11/01 Javascript
textarea 控制输入字符字节数(示例代码)
2013/12/27 Javascript
javascript计算用户打开网页的停留时间
2014/01/09 Javascript
jquery $.trim()方法使用介绍
2014/05/21 Javascript
让javascript加载速度倍增的方法(解决JS加载速度慢的问题)
2014/12/12 Javascript
jQuery+css实现的切换图片功能代码
2016/01/27 Javascript
基于React实现表单数据的添加和删除详解
2017/03/14 Javascript
JS写谷歌浏览器chrome的外挂实例
2018/01/11 Javascript
WebSocket的通信过程与实现方法详解
2018/04/29 Javascript
webpack 样式加载的实现原理
2018/06/12 Javascript
如何测量vue应用运行时的性能
2019/06/21 Javascript
详解python之协程gevent模块
2018/06/14 Python
python程序封装为win32服务的方法
2021/03/07 Python
python列表list保留顺序去重的实例
2018/12/14 Python
命令行运行Python脚本时传入参数的三种方式详解
2019/10/11 Python
opencv 图像滤波(均值,方框,高斯,中值)
2020/07/08 Python
一款利用css3的鼠标经过动画显示详情特效的实例教程
2014/12/29 HTML / CSS
HTML5 Canvas实现图片缩放、翻转、颜色渐变的代码示例
2016/02/28 HTML / CSS
巴西美妆购物网站:Kutiz Beauté
2019/03/13 全球购物
手工制作的意大利皮革运动鞋:KOIO
2020/01/05 全球购物
考博自荐信
2013/10/25 职场文书
政法大学毕业生自荐信范文
2014/01/01 职场文书
信访工作者先进事迹
2014/01/17 职场文书
父亲的菜园教学反思
2014/02/13 职场文书
文秘求职信范文
2014/04/10 职场文书
同居协议书范本
2014/04/23 职场文书
电焊工岗位工作职责
2014/07/09 职场文书
2015年电话客服工作总结
2015/05/18 职场文书
什么是Python装饰器?如何定义和使用?
2022/04/11 Python
css3手动实现pc端横向滚动
2022/06/21 HTML / CSS