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 相关文章推荐
jQuery 常见开发使用技巧总结
Dec 26 Javascript
jquery.Jwin.js 基于jquery的弹出层插件代码
May 23 Javascript
innerText和textContent对比及使用介绍
Feb 27 Javascript
jQuery JSON实现无刷新三级联动实例探讨
May 28 Javascript
A标签触发onclick事件而不跳转的多种解决方法
Jun 27 Javascript
利用js判断浏览器类型(是否为IE,Firefox,Opera浏览器)
Nov 22 Javascript
jquery组件使用中遇到的问题整理及解决
Feb 21 Javascript
js制作简易年历完整实例
Jan 28 Javascript
jQuery easyui datagird编辑行删除行功能的实现代码
Sep 20 jQuery
Vue-input框checkbox强制刷新问题
Apr 18 Javascript
layui监听工具栏的实例(操作列表按钮)
Sep 10 Javascript
关于better-scroll插件的无法滑动bug(2021通过插件解决)
Mar 01 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
php字符串过滤与替换小结
2015/01/26 PHP
Symfony2框架学习笔记之HTTP Cache用法详解
2016/03/18 PHP
关于php中一些字符串总结
2016/05/05 PHP
jQuery为iframe的body添加click事件的实现代码
2011/04/07 Javascript
JS高级笔记
2011/07/13 Javascript
javascript实现div浮动在网页最顶上并带关闭按钮效果实例
2013/08/13 Javascript
不同Jquery版本引发的问题解决
2013/10/14 Javascript
javascript自定义的addClass()方法
2014/05/28 Javascript
js事件绑定快捷键以ctrl+k为例
2014/09/30 Javascript
JavaScript实现强制重定向至HTTPS页面
2015/06/10 Javascript
jQuery基于ajax实现带动画效果无刷新柱状图投票代码
2015/08/10 Javascript
基于jQuery仿淘宝产品图片放大镜特效
2020/10/19 Javascript
基于jQuery实现发送短信验证码后的倒计时功能(无视页面关闭)
2016/09/02 Javascript
bootstrap-datetimepicker实现只显示到日期的方法
2016/11/25 Javascript
详解node服务器中打开html文件的两种方法
2017/09/18 Javascript
深入理解Vue.js源码之事件机制
2017/09/27 Javascript
使用vue + less 实现简单换肤功能的示例
2018/02/21 Javascript
JS获取url参数,JS发送json格式的POST请求方法
2018/03/29 Javascript
vue文件树组件使用详解
2018/03/29 Javascript
JavaScript中this关键字用法实例分析
2018/08/24 Javascript
vue中使用heatmapjs的示例代码(结合百度地图)
2018/09/05 Javascript
微信小程序加载机制及运行机制图解
2019/11/27 Javascript
JavaScript适配器模式原理与用法实例详解
2020/03/09 Javascript
Python中tell()方法的使用详解
2015/05/24 Python
Python列表list解析操作示例【整数操作、字符操作、矩阵操作】
2017/07/25 Python
Python实现的字典值比较功能示例
2018/01/08 Python
python实现两个文件合并功能
2018/04/01 Python
Pycharm配置远程调试的方法步骤
2018/12/17 Python
Python 余弦相似度与皮尔逊相关系数 计算实例
2019/12/23 Python
Anconda环境下Vscode安装Python的方法详解
2020/03/29 Python
协程Python 中实现多任务耗资源最小的方式
2020/10/19 Python
Shell脚本如何向终端输出信息
2014/04/25 面试题
食堂员工工作职责
2013/12/18 职场文书
毕业生自荐书
2014/02/03 职场文书
2014年党员教师自我剖析材料
2014/09/30 职场文书
redis内存空间效率问题的深入探究
2021/05/17 Redis