childNodes.length与children.length的区别_javascript技巧

因为childNodes包含的不仅仅只有html节点,所有属性,文本等都包含在childNodes里面,你可以通过nodeType来判断是哪种类型的节点,只有当nodeType==1时才使元素节点,2是属性节点,3是文本节点。而children.length只计算节点的数量。
包括进行节点长度的计算,节点的移动时都要注意这一点。
要获得一个元素的文本,比如要获得一个P节点的文本,有的人喜欢使用innerHTML,更改也是一样,其实这不太好,因为使用innerHTML浏览器会认为你要插入的东西是一段标签文本,而你只想插入一段纯文本,这就导致浏览器试图去解析你的那段纯文本,这会造成不必要的资源浪费。所以建议使用element.firstChild.nodeValue,为什么是firstChild呢?因为childNodes[0]就是文本节点,不信你可以看看它的nodeType。

时间: 2024-10-30 05:22:29

childNodes.length与children.length的区别_javascript技巧的相关文章

JavaScript中document.forms[0]与getElementByName区别_javascript技巧

首先我们来看个示例: 复制代码 代码如下: <form name="buyerForm" method="post" action="/mysport/control/user/list.do"> <input type="checkbox" id="usernames" value="testtest" >testtest<br> <input

理解Javascript的caller,callee,call,apply区别_javascript技巧

在提到上述的概念之前,首先想说说javascript中函数的隐含参数:arguments arguments 该对象代表正在执行的函数和调用它的函数的参数. [function.]arguments[n] 参数function :选项.当前正在执行的 Function 对象的名字. n :选项.要传递给 Function 对象的从0开始的参数值索引.  说明 arguments是进行函数调用时,除了指定的参数外,还另外创建的一个隐藏对象.arguments是一个类似数组但不是数组的对象,说它类似

JavaScript操作DOM元素的childNodes和children区别_javascript技巧

对于DOM元素,children是指DOM Object类型的子对象,不包括tag之间隐形存在的TextNode,而childNodes包括tag之间隐形存在的TextNode对象. 具体看一下针对children和childNodes在chrome环境下的测试: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</

IE与FireFox中的childNodes区别_javascript技巧

Javascript中,相信大家都试过用getElementsByTagName和childNodes来实现对节点的遍历.但是 getElementsByTagName对复杂的DOM结构遍历明显不如用childNodes,因为childNodes能更好的处理DOM的层次结构,建议在需要进行了遍历时首先使用childNodes!! 但是不幸的是,在IE和FireFox中childNodes有点细微的差别: 复制代码 代码如下: <head> <script type="text/

ajax中get和post的说明及使用与区别_javascript技巧

以前没怎么仔细的研究过ajax,只是用到了就直接拿过来用,发现了问题再找解决方法.以下是我在找解决问题的过程中的一点小小的总结. 一.谈Ajax的Get和Post的区别 Get方式: 用get方式可传送简单数据,但大小一般限制在1KB下,数据追加到url中发送(http的header传送),也就是说,浏览器将各个表单字段元素及其数据按照URL参数的格式附加在请求行中的资源路径后面.另外最重要的一点是,它会被客户端的浏览器缓存起来,那么,别人就可以从浏览器的历史记录中,读取到此客户的数据,比如帐号

一道优雅面试题分析js中fn()和return fn()的区别_javascript技巧

在js中,经常会遇到在函数里调用其它函数的情况,这时候会有 fn() 这种调用方式,还有一种是 return fn() 这种调用方式,一些初学者经常会被这两种方式给绕晕了.这里用一个优雅的面试题来分析一下两种方式的不同之处.  var i = 0; function fn(){ i++; if(i < 10){ fn(); }else{ return i; } } var result = fn(); console.log(result); 这是一道隐藏了坑的面试题,看似很简单,大部分人可能想

浅谈Javascript中substr和substring的区别_javascript技巧

 由于在项目中有需要对字符串进行截取,然后手残使用了IDE自动提示的substr,没想那么多以为substr和substring没多大区别. 然而并不是,且听我一一道来. 1. substr(index, length)   从起始索引号提取字符串中指定数目的字符.   substr方法可以传入两个参数 index和length.index是起始位,length是截取的长度.   当index是个非负整数时:     a. 如果不传入参数,则得到的还是字符串本身.         如: "abc

innertext , insertadjacentelement , insertadjacenthtml , insertadjacenttext 等区别_javascript技巧

innerText 属性在 IE 浏览器中可以得到当前元素过滤掉 HTML Tags 之后的文本内容在某些时候还是比较有用.但类似的非标准属性/方法在其他浏览器中并不一定都得到支持. 类似的像 insertAdjacentElement , insertAdjacentElement , insertAdjacentHTML , insertAdjacentText 等.如果需要使用这些非标准的方法或者已有的代码大量使用了这些方法的话就必须为其他浏览器提供对应的 prototype 定义.比如

整理的比较全的event对像在ie与firefox浏览器中的区别_javascript技巧

window.event IE:有window.event对象 FF:没有window.event对象.可以通过给函数的参数传递event对象.如onmousemove=doMouseMove(event) 鼠标当前坐标 IE:event.x和event.y. FF:event.pageX和event.pageY. 通用:两者都有event.clientX和event.clientY属性. 鼠标当前坐标(加上滚动条滚过的距离) IE:event.offsetX和event.offsetY. FF