JavaScript实现获取某个元素相邻兄弟节点的prev与next方法


Posted in Javascript onJanuary 25, 2016

本文实例讲述了JavaScript实现获取某个元素相邻兄弟节点的prev与next方法。分享给大家供大家参考,具体如下:

/**
* 获取相邻元素
* @param ele 参考物元素
* @param type 类型,上一个(1)or下一个(0)
* @return 返回查找到的元素Dom对象,无则返回null
*/
function getNearEle(ele, type) {
  type = type == 1 ? "previousSibling" : "nextSibling";
  var nearEle = ele[type];
  while(nearEle) {
    if(nearEle.nodeType === 1) {
      return nearEle;
    }
    nearEle = nearEle[type];
    if(!nearEle) {
      break;
    }
  }
  return null;
}
/**
* 获取当前执行对象的上一个元素
*/
function prev() {
  return getNearEle(this, 1);
}
/**
* 获取当前执行对象的下一个元素
*/
function next() {
  return getNearEle(this, 0);
}
// var ele = document.getElementById("xxx");
// var prevElement = prev.call(ele);
// var nextElement = next.call(ele);

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Javascript 去除数组的重复元素
May 04 Javascript
jQuery实战之仿淘宝商城左侧导航效果
Apr 12 Javascript
遍历DOM对象内的元素属性示例代码
Feb 08 Javascript
jquery解析XML字符串和XML文件的方法说明
Feb 21 Javascript
js控制div弹出层实现方法
May 11 Javascript
使用Script元素发送JSONP请求的方法
Jun 12 Javascript
微信小程序开发之麦克风动画 帧动画 放大 淡出
Apr 18 Javascript
jQuery条件分页 代替离线查询(附代码)
Aug 17 jQuery
js实现可以点击收缩或张开的悬浮窗
Sep 18 Javascript
在Create React App中启用Sass和Less的方法示例
Jan 16 Javascript
javascript+HTML5 canvas绘制时钟功能示例
May 15 Javascript
Javascript call及apply应用场景及实例
Aug 26 Javascript
JavaScript事件类型中焦点、鼠标和滚轮事件详解
Jan 25 #Javascript
JavaScript实现给定时间相加天数的方法
Jan 25 #Javascript
jQuery中inArray方法注意事项分析
Jan 25 #Javascript
jquery ui dialog替代confirm实例分析
Jan 25 #Javascript
AngularJS控制器controller正确的通信的方法
Jan 25 #Javascript
AngularJS入门心得之directive和controller通信过程
Jan 25 #Javascript
详解jquery事件delegate()的使用方法
Jan 25 #Javascript
You might like
计算一段日期内的周末天数的php代码(星期六,星期日总和)
2009/11/12 PHP
PHP获取服务器端信息的方法
2014/11/28 PHP
php微信支付之APP支付方法
2015/03/04 PHP
js 替换
2008/02/19 Javascript
firefox和IE系列的相关区别整理 以备后用
2009/12/28 Javascript
js 距离某一时间点时间是多少实现代码
2013/10/14 Javascript
AngularJS语法详解(续)
2015/01/23 Javascript
实例讲解jquery中mouseleave和mouseout的区别
2016/02/17 Javascript
jquery插件autocomplete用法示例
2016/07/01 Javascript
Vue.js创建Calendar日历效果
2016/11/03 Javascript
JS 调试中常见的报错问题解决方法
2017/05/20 Javascript
基于vue.js的分页插件详解
2017/11/27 Javascript
详解webpack babel的配置
2018/01/09 Javascript
vue 使用自定义指令实现表单校验的方法
2018/08/28 Javascript
Vue+Element ui 根据后台返回数据设置动态表头操作
2020/09/21 Javascript
Vue3不支持Filters过滤器的问题
2020/09/24 Javascript
解决vue安装less报错Failed to compile with 1 errors的问题
2020/10/22 Javascript
Python3基础之输入和输出实例分析
2014/08/18 Python
python操作字典类型的常用方法(推荐)
2016/05/16 Python
关于Python面向对象编程的知识点总结
2017/02/14 Python
Python3匿名函数用法示例
2018/07/25 Python
详解通过API管理或定制开发ECS实例
2018/09/30 Python
django 中使用DateTime常用的时间查询方式
2019/12/03 Python
详谈tensorflow gfile文件的用法
2020/02/05 Python
TensorFlow 输出checkpoint 中的变量名与变量值方式
2020/02/11 Python
Python中操作各种多媒体,视频、音频到图片的代码详解
2020/06/04 Python
Python txt文件如何转换成字典
2020/11/03 Python
AmazeUI 点击元素显示全屏的实现
2020/08/25 HTML / CSS
印度尼西亚值得信赖的第一家网店:Bhinneka
2018/07/16 全球购物
网页设计个人找工作求职信
2013/11/28 职场文书
客户服务经理岗位职责
2014/01/29 职场文书
项目建议书格式
2014/03/12 职场文书
《厄运打不垮的信念》教学反思
2014/04/13 职场文书
服务承诺口号
2014/05/22 职场文书
项目申请汇报材料
2014/08/16 职场文书
单位考核聘任报告
2015/03/02 职场文书