DOM之兄弟节点
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>兄弟节点previousSibling</title>
</head>
<body>
<ul id="ele">
<li id='li1'>前端开发课程</li>
<li id='li2'>javaScript课程</li>
<li id="li3">HTML5课程</li>
<li id="li4">CSS课程</li>
<li id="li5">其它网站开发经典课程</li>
<li id="li6">jQuery是其中的一部</li>
</ul>
</body>
<script type="text/ecmascript">
function previousSibling(ele) {
//先判断它支持不支持这个属性
if (typeof previousElementSibling == 'object') {
//如果支持直接返回return ele.previousElementSibling;
return ele.previousElementSibling;
} else {
//如果不支持就返回 ele.previousSibling
//元素的父节点
ele.previousSibling
//判断元素的哥哥节点,循环
do {
if (ele.previousSibling&&ele.previousSibling.nodeType=="1") {
return ele.previousSibling
}else{
ele = ele.previousSibling;
}
} while (ele)
return null;
}
}
var oLi1 = document.getElementById("ele").children[0];
var pre=previousSibling(oLi1)
alert(pre)//弹出null
//var oLi1 = document.getElementById("ele").children[1];
//var pre = previousSibling(oLi1)
//alert(pre)//弹出objectHTMLLIElement
</script>
</html>
DOM之兄弟节点的更多相关文章
- 遍历DOM树,获取所有兄弟节点
获取兄弟节点的常用方法有: 方法 说明 siblings() 选取所有兄弟节点 next() 选取后面兄弟节点 nextAll() 选取所有后面的兄弟节点 nextUntil() 选取所有 ...
- JavaScript的BOM、DOM操作、节点以及表格(二)
BOM操作 一.什么是BOM BOM(Browser Object Model)即浏览器对象模型. BOM提供了独立于内容 而与浏览器窗口进行交互的对象: BOM由一系列相关的对象构成 ...
- 总结获取原生JS(javascript)的父节点、子节点、兄弟节点
关于原生JS获取节点,一直是个头疼的问题,而且调用方法的名字又贼长了,所以我选择用JQ,好像跑题了-- 话不多说看代码 获取父节点 及 父节点下所有子节点(兄弟节点) <ul> <l ...
- JS获取子节点、父节点和兄弟节点的方法实例总结
转自:https://www.jb51.net/article/143286.htm 本文实例讲述了JS获取子节点.父节点和兄弟节点的方法.分享给大家供大家参考,具体如下: 一.js获取子节点的方式 ...
- Dom 获取、Dom动态创建节点
一.Dom获取 1.全称:Document Object Model 文档对象模型 2.我们常用的节点类型 元素(标签)节点.文本节点.属性节点(也就是标签里的属性). 3.docum ...
- DOM简介及节点、属性、查找节点的方法
DOM(Document Object Modle) 操作文档的编程接口DOM定义了表示和修改文档的方法,不能修改css样式表,在js中使用DOM方法改变元素的css样式,实质上是在元素上添加行间样式 ...
- jquery 获取元素(父节点,子节点,兄弟节点)
费话不多说,直接上代码jquery 获取元素 $("#test1").parent(); // 父节点 $("#test1").parents(); // 全部 ...
- javascript DOM中的节点层次和节点类型概述
针对JS高级程序设计这本书,主要是理解概念,大部分要点源自书内.写这个主要是当个笔记加总结 存在的问题请大家多多指正! 因为DOM这方面的对象方法操作性都特别强,但是逻辑很简单,所以就没有涉及到实际的 ...
- JavaScript---Dom树详解,节点查找方式(直接(id,class,tag),间接(父子,兄弟)),节点操作(增删改查,赋值节点,替换节点,),节点属性操作(增删改查),节点文本的操作(增删改查),事件
JavaScript---Dom树详解,节点查找方式(直接(id,class,tag),间接(父子,兄弟)),节点操作(增删改查,赋值节点,替换节点,),节点属性操作(增删改查),节点文本的操作(增删 ...
随机推荐
- Comware 架构理解
网络操作系统 首先什么是网络操作系统: 一种说法是:运行在路由器,网络交换机,防火墙上的特别的操作系统 另一种说法是:部署在局域网或者私有网络,允许网络中的多个计算机共享文件和打印机,因为现在的单机系 ...
- Codeforces Round #377 (Div. 2) C. Sanatorium 水题
C. Sanatorium time limit per test 1 second memory limit per test 256 megabytes input standard input ...
- domion Designer 管理员ID过期
上班没几天,刚接触lotus domion 有一个服务器上打开相应的数据库提示 你的证书已经过期,网上找到的解决方案: ---------------------------------------- ...
- Mac开发环境搭建
参考文档一:Mac 开发者常用的工具 参考文档二:高效 MacBook 工作环境配置 IntelliJ IDEA 简体中文专题教程 IntelliJ IDEA 相关技巧视频 IntelliJ IDEA ...
- Scrum Meeting---Eight(2015-11-3)
今日已完成任务和明日要做的任务 姓名 今日已完成任务 今日时间 明日计划完成任务 估计用时 董元财 数据库与客户端通讯 5h 服务器与客户端通讯测试 4h 胡亚坤 好友添加 2h 好友添加 2h 刘猛 ...
- new,delete和malloc,free以及allocator<T>
一)new和delete,自己觉得一句话就是:最好同一作用域内,必须成对使用 先给出自己的认识: malloc,free,申请和释放一段heap堆中的内存. new:申请heap内存并在申请的内存中放 ...
- php用curl调用接口方法,get和post两种方式
首先是客户端执行方法ApiModel.php: <?php /** * 模拟post进行url请求 * @param string $url * @param array $post_data ...
- 关于Socket的经验小结
前言 IM通信在互联网发展到现在已经是码农的世界里人尽皆知的技术,特别在当下移动互联网迅猛发展的时代这种技术的开发也更加火热,其中老牌的代表作就有QQ和MSN,和最近新崛起的微信,默默,易信,来往等眼 ...
- dbca建库时找不到ASM磁盘
现象 dbca创建数据库时,找不到ASM磁盘组:而grid用户使用asmca却又能看到ASM磁盘组. 解决方法 1. 检查设备的权限,正确的权限为grid:asmadmin 2. 检查GRID_HOM ...
- Kafka文件的存储机制
Kafka文件的存储机制 同一个topic下有多个不同的partition,每个partition为一个目录,partition命名的规则是topic的名称加上一个序号,序号从0开始. 每一个part ...