javascript中的nextSibling使用陷(da)阱(keng)
今天写js的时候遇到了一个陷(da)阱(keng)
关于HTML/XML节点的问题
据说在IE中nextSibling不会返回文本节点,而chrome或者firefox等会返回文本节点……
这个我的工作带来了很严重的问题
在网上搜到了很多处理方法,都是给js添加各种封装的函数……
后来我发现有个nextElementSibling方法……
这个不会返回文本节点,不管是什么浏览器……
真是大坑
同样,对于fistChild有对应的firstElementChild。其他的选择节点的函数应该也有对应的Element方法,不过还没试过……
然后我突然发现了个fistChildElement()……⊙﹏⊙b汗,我猜这是c++里面的……
相关推荐
-
js nextSibling属性和previousSibling属性概述及使用注意
1:nextSibling属性 该属性表示当前节点的下一个节点(其后的节点与当前节点同属一个级别):如果其后没有与其同级的节点,则返回null. 需要特别注意的是:该属性在不同的浏览器中的执行结果并不都相同,见下面例示: 先来看一个例子: 复制代码 代码如下: <body> <div> <input id="a4" type="button" onclick="alert(this.nextSibling);" va
-
只能是字母或数字或者是字母和数字的组合的正则previousSibling
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
-
nextSibling
家庭保姆 家庭保姆 家庭保姆 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
-
javascript nextSibling 与 getNextElement(node) 使用介绍
1. nextSibing:下一个节点,节点类型可以是任何一种,其中就有文本节点. 2.得到下一个元素节点: 复制代码 代码如下: function getNextElement(node){ if(node.nodeType == 1){ return node; } if(node.nextSibling){ return getNextElement(node.nextSibling); } return null; }
-
javascript中的previousSibling和nextSibling的正确用法
我做的时间的验证,格式是不需要验证的,只需要验证起始日期与结束日期的大小,但是因为输入页面是批量的,而且每一行又是自动生成的,这样就不能用id来作为参数,只能用节点.这就给验证增加了难度. 以下是jsp页面的部分: <td><input id="warrantyStartDateStr" name="warrantyStartDateStr" class="toolbar_button_input_80" type="
-
javascript中的nextSibling使用陷(da)阱(keng)
今天写js的时候遇到了一个陷(da)阱(keng) 关于HTML/XML节点的问题 据说在IE中nextSibling不会返回文本节点,而chrome或者firefox等会返回文本节点-- 这个我的工作带来了很严重的问题 在网上搜到了很多处理方法,都是给js添加各种封装的函数-- 后来我发现有个nextElementSibling方法-- 这个不会返回文本节点,不管是什么浏览器-- 真是大坑 同样,对于fistChild有对应的firstElementChild.其他的选择节点的函数应该也有对应
-
JavaScript中对DOM节点的访问、创建、修改、删除
DOM DOM就是Document object Model的缩写.文档对象模型是把XML或HTML以树节点为表现形式的文档.用DOM方法和属性,你可以访问,修改,删除页面上任意一个元素,也是可以添加一个元素.DOM是独立于语言的API,可以被任意语言所实现,当然也包括了Javascript 看看下面的一个文本. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/
-
javascript中节点的最近的相关节点访问方法
在javascript中对文档中每个节点都有 parentNode--父节点 firstChild--第一个子节点 lastChild--最后一个子节点 previousSibling--紧挨着的前面的兄弟节点 nextSibling--紧挨着的后面的兄弟节点 五个相关的节点,这些节点可以不存在,为null.例如document就不包含父节点,文本节点(TextNode)就不包含子节点. 这样就可以作短途旅行,访问当前节点的某些相关节点. 另外还有childNode[](包含所有的子节点)和ch
-
浅析JavaScript中浏览器的兼容问题
浏览器兼容性问题是在实际开发中容易忽略而又最重要的一部分.我们在讲老版本浏览器兼容问题之前,首先要了解什么是能力检测,它是来检测浏览器有没有这种能力,即判断当前浏览器是否支持要调用的属性或者方法.下面做了一些简短的介绍. 1.innerText 和 innerContent 1)innerText 和 innerContent 的作用相同 2)innerText IE8之前的浏览器支持 3)innerContent 老版本的Firefox支持 4)新版本的浏览器两种方式都支持 1 // 老版本浏
-
深入理解JavaScript中的传值与传引用
1.传值(by value) 变量的值被复制出一份,与原来的值将不相干,也就是说即使新的值被修改,原来的值也不会改变,在JavaScript中基本类型都是传值的. 复制代码 代码如下: function testPassValue(){ var m=1; var n=2; //将m,n的值复制一份,传递到passValue passValue(m,n); alert(m); //将是原有的值}function passValue(a,b){ a = a+b; //改变a的
-
JavaScript中BOM和DOM详解
目录 BOM(浏览器对象模型) 1. window 获取浏览器c窗口尺寸 2. screen 获取电脑屏幕大小 3. window 开启关闭窗口 4. 浏览器事件 5. location 6. history 7. navigator 获取浏览器相关信息 8. 弹窗 DOM (文档对象模型) DOM 分类 DOM对象 Document文档对象 element文档对象 DOM事件操作 鼠标事件 键盘事件 触屏事件 特殊事件 表单事件 浏览器兼容处理 兼容性写法,封装工具 BOM(浏览器对象模型)
-
一篇文章带你吃透JavaScript中的DOM知识及用法
目录 一.前言 二.DOM框架 三.认识DOM节点 四.JS访问DOM 1.获取节点 2.改变 HTML 3.改变 CSS 4.检测节点类型 5.操作节点间的父子及兄弟关系 6.操作节点属性 7.创建和操作节点 总结 一.前言 DOM:Document Object Model(文档对象模型),定义了用户操作文档对象的接口,可以说DOM是自HTML将网上相关文档连接起来后最伟大的创新.它使得用户对HTML有了空前的访问能力,并使开发者将HTML作为XML文档来处理. 本文知识导图如下: 二.DO
-
JavaScript中立即执行函数实例详解
前言 js立即执行函数可以让你的函数在创建后立即执行,js立即执行函数模式是一种语法,可以让你的函数在定义后立即被执行,这种模式本质上就是函数表达式(命名的或者匿名的),在创建后立即执行. ( function(){-} )()和( function (){-} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到函数定义后立即执行的目的,后来发现加括号的原因并非如此. 下面话不多说了,来一起看看详细的介绍吧. 通常我们声
-
JavaScript中正则表达式的概念与应用
今天和大家分享一些关于正则表达式的知识和在javascript中的应用.正则表达式简单却又不简单,比如以前我的老师给我们讲的时候就说这个东西入门的话二三十分钟就精通了,一旦没有入门那就可几天都补不回来.于是当初就很认真的学习并研究了它.没想到正则表达式不仅代码简洁,而且在实际的操作中为前端工程师们省事了不少.总所周知,用户在浏览页面的时候,唯一和数据打交道的就是表单了,关于表单的验证,其实有很多中方法,接下来,我就会给大家分享两种,一种是普通繁琐的方法,一种是正则表达式,看看它到底能够给表单带来
-
Javascript中正则表达式的使用及基本语法
前面的话 正则表达式在人们的印象中可能是一堆无法理解的字符,但就是这些符号却实现了字符串的高效操作.通常的情况是,问题本身并不复杂,但没有正则表达式就成了大问题.javascript中的正则表达式作为相当重要的知识,本文将介绍正则表达式的基础语法 定义 正则表达式(Regular Expression)是一门简单语言的语法规范,是强大.便捷.高效的文本处理工具,它应用在一些方法中,对字符串中的信息实现查找.替换和提取操作 javascript中的正则表达式用RegExp对象表示,有两种写法:一种
随机推荐
- html中嵌入flv格式文件的代码
- AngularJS的ng-click传参的方法
- Linux下修改Oracle监听地址的方法
- windows下安装ruby与rails时遇到的问题总结
- js函数在frame中的相互调用详解
- Spring中属性注入详解
- 浅谈Java中的四种引用方式的区别
- ASP.NET餐饮管理系统制作代码分享
- Android使用MediaRecorder类进行录制视频
- php 从一个数组中随机的取出若干个不同的数实例
- Python爬虫抓取手机APP的传输数据
- MySQL生产库Insert了2次同样的记录但是主键ID是不一样的问题的分析过程
- JDK的Parser来解析Java源代码详解
- jQuery如何实现点击页面获得当前点击元素的id或其他信息
- 【经典源码收藏】基于jQuery的项目常见函数封装集合
- java 读取本地文件实例详解
- 初识Java8中的Stream
- C#实现谷歌翻译API示例代码
- 使用python实现knn算法
- Python生成任意范围任意精度的随机数方法