Javascript 学习 笔记四

1、children和childNodes(参考:JavaScript中Element与Node的区别,children与childNodes的区别 children和childNodes

Node(节点)是DOM层次结构中的任何类型的对象的通用名称,Node有很多类型,如元素节点,属性节点,文本节点,注释节点等,通过NodeType区分,常见的有:

节点类型 NodeType
元素element 1
属性attr 2
文本text 3
注释comments 8
文档document 9

更多节点类型参考:https://developer.mozilla.org/en-US/docs/DOM/Node.nodeType?redirectlocale=en-US&redirectslug=nodeType

Element继承了Node类,也就是说Element是Node多种类型中的一种,即当NodeType为1时Node即为ElementNode,另外Element扩展了Node,Element拥有id、class、children等属性。

以上就是Element跟Node的区别。

childNodes 属性,它返回指定元素的子元素集合,包括HTML节点,所有属性,文本。可以通过nodeType来判断是哪种类型的节点,只有当nodeType==1时才是元素节点,2是属性节点,3是文本节点。

有些人错误的使用()去取该集合元素,下表列出各浏览器对childNodes(i)的支持情况:

IE6/7/8/Safari/Chrome/Opera IE9/Firefox
childNodes(i) 支持 不支持

children 属性,它返回指定元素的子元素集合。经测试,它只返回HTML节点,甚至不返回文本节点。且在所有浏览器下表现惊人的一致

2、document.body.scrollTop or document.documentElement.scrollTop(参考:点击打开链接

用Javascript获取DOM节点相对于页面的绝对坐标时,需要计算当前页面的滚动距离,而这个值的获取又取决于浏览器。
在Firefox或Chrome浏览器的控制台可以查看document.body 对应于页面中 <body></body>部分的元素,而document.documentElement则相当于整个HTML,说明浏览器在解释渲染后的页面位置范围是存在不同的,FF、Opera和IE浏览器认为在客户端浏览器展示的页面的内容对应于整个HTML,所以使用document.documentElement来代表,相应的滚动距离则通过document.documentElement.scrollLeft 和 document.documentElement.scrollTop来获取,而Safari和Chrome浏览器则认为页面开始于body部分,从而相应的滚动距离用document.body.scrollLeft 和 document.body.scrollTop来获取。另外需要注意的是,FF和IE的quirks mode(兼容模式)下是用document.body来获取的。

3、Document 对象

每个载入浏览器的 HTML 文档都会成为 Document 对象。
Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
提示:Document 对象是 Window 对象的一部分,可通过 window.document 属性对其进行访问。

4、Event 对象

Js event事件在IE、FF兼容性问题

IE:有window.event对象 
FF:没有window.event对象。可以通过给函数的参数传递event对象。 

 <script type="text/javascript">
        function showDiv(event) {
            var event = window.event || event;
            event.clientX;
            event.clientY;
        }
    </script>

5、真假值

在javascript中,数据类型可以分为“真值”和“假值”。顾名思义,真值转换为bool时值为true;假值转换为bool时值为false。

下表罗列了一些常见的数据类型转换为bool时的值:

数据类型 转换为bool后的值
null FALSE
undefined FALSE
Object TRUE
function TRUE
0 FALSE
1 TRUE
0、1之外的数字 TRUE
字符串 TRUE
""(空字符串) FALSE

6、&&与||

在javascript中,“&&”运算符运算法则如下:

如果&&左侧表达式的值为真值,则返回右侧表达式的值;否则返回左侧表达式的值。

“||”运算符的运算法则如下:
如果||左侧表达式的值为真值,则返回左侧表达式的值;否则返回右侧表达式的值。

作者:jiankunking 出处:http://blog.csdn.net/jiankunking

时间: 2024-10-28 09:11:22

Javascript 学习 笔记四的相关文章

javascript学习笔记(四) Number 数字类型_基础知识

toFixed() 方法指定小数位个数 toExponential() 方法 用科学计数法表示数,参数指定小数位个数 toPrecision() 方法自动判断调用toFixed()或toExponential()方法,参数指定所有数的位数 复制代码 代码如下: var num = 99; alert(toFixed(2)); //99.00 alert(toExponential(1)); //9.0e+1 alert(toPrecision(1)); //9.0e+1 alert(toPrec

javascript学习笔记(四)function函数部分_基础知识

函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块. Jscript 支持两种函数:一类是语言内部的函数(如eval() ),另一类是自己创建的. 在 JavaScript 函数内部声明的变量(使用 var)是局部变量,所以只能在函数内部访问它.(该变量的作用域是局部的). 您可以在不同的函数中使用名称相同的局部变量,因为只有声明过该变量的函数才能识别出该变量. 函数的调用方式 1.普通调用:functionName(实际参数...) 2.通过指向函数的变量去调用: var  myVar

Javascript学习笔记之 对象篇(四) : for in 循环_基础知识

先上范例: // Poisoning Object.prototype Object.prototype.bar = 1; var foo = {moo: 2}; for(var i in foo) { console.log(i); // prints both bar and moo } 这里我们要注意两点,一是 for in 循环会忽略 enumerable 设置为 false 的属性.例如一个数组的 length 属性.第二是,由于 for in 会遍历整个原型链,所以当原型链过长时,会

JavaScript学习笔记之创建对象_javascript技巧

JavaScript 有Date.Array.String等这样的内置对象,功能强大使用简单,人见人爱,但在处理一些复杂的逻辑的时候,内置对象就很无力了,往往需要开发者自定义对象. 从JavaScript定义上讲对象是无序属性的集合,其属性可以包含基本值.对象或函数.也就是说对象是一组没有特定顺序的属性,每个属性会映射到一个值上,是一组键值对,值可以是数据或对象. 对象是JavaScript的基本数据类型.在JavaScript中除了字符串.数字.true.false.null和undefine

JavaScript学习笔记之检测客户端类型是(引擎、浏览器、平台、操作系统、移动设备)_javascript技巧

//取得用户代理字符串 并全部小写. var ua = navigator.userAgent.toLowerCase(); document.write(ua); 在上篇文章给大家介绍了基于javascript代码检测访问网页的浏览器呈现引擎.平台.Windows操作系统.移动设备和游戏系统 ,感兴趣的朋友可以点击全文了解详情. 1.识别呈现引擎 引擎主要包含四种:IE.Gecko.WebKit.Opera 2.识别浏览器 主流浏览器包含四种:IE.Chrome.Firefox.Opera 3

JavaScript学习笔记(三):JavaScript也有入口Main函数_javascript技巧

在C和Java中,都有一个程序的入口函数或方法,即main函数或main方法.而在JavaScript中,程序是从JS源文件的头部开始运行的.但是某种意义上,我们仍然可以虚构出一个main函数来作为程序的起点,这样一来不仅可以跟其他语言统一了,而且说不定你会对JS有更深的理解. 1. 实际的入口 当把一个JavaScript文件交给JS引擎执行时,JS引擎就是从上到下逐条执行每条语句的,直到执行完所有代码. 2. 作用域链.全局作用域和全局对象 我们知道,JS中的每个函数在执行时都会产生一个新的

JavaScript学习笔记之数组去重_javascript技巧

推荐阅读:JavaScript学习笔记之数组的增.删.改.查 JavaScript学习笔记之数组求和方法 JavaScript学习笔记之数组随机排序 话说面试常会碰到面试官会问JavaScript实现数组去重的问题,最近刚好在学习有关于JavaScript数组相关的知识,趁此机会整理了一些有关于JavaScript数组去重的方法. 下面这些数组去重的方法是自己收集和整理的,如有不对希望指正文中不对之处. 双重循环去重 这个方法使用了两个for循环做遍历.整个思路是: 构建一个空数组用来存放去重后

kvm虚拟化学习笔记(四)之kvm虚拟机日常管理与配置

原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://koumm.blog.51cto.com/703525/1290269 KVM虚拟化学习笔记系列文章列表 ---------------------------------------- kvm虚拟化学习笔记(一)之kvm虚拟化环境安装http://koumm.blog.51cto.com/703525/1288795 kvm虚拟化学习笔记(二)之linux kvm虚拟机安装 h

JavaScript学习笔记整理_用于模式匹配的String方法_基础知识

用于模式匹配的String方法: String支持4种使用正则表达式的方法: seach()用于检索,参数是一个正则表达式,返回第一个与之匹配的子串的位置,找不到则返回-1,如果参数不是正则表达式,则首先会通过RexExp构造函数将它转换成正则表达式,seach()方法不支持全局搜索,它忽略修饰符g: replace()用于检索与替换操作,第一个参数是一个正则表达式,第二个参数是要进行替换的字符串.它对调用该方法的字符串检索,按照模式匹配子串替换成第二个参数,若包含修饰符g则全文匹配.若第一个参