Javascript 学习 笔记四

简介: 1、children和childNodes(参考:JavaScript中Element与Node的区别,children与childNodes的区别 children和childNodes) Node(节点)是DOM层次结构中的任何类型的对象的通用名称,Node有很多类型,如元素节点,属性节点,文本节点,注释节点等,通过NodeType区分,常见的有:节点类型NodeType元

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




相关文章
|
JavaScript 前端开发
学习JavaScript笔记
学习JavaScript笔记
38 0
学习JavaScript笔记
|
JavaScript 前端开发
Javascript 学习 笔记六
1、javascript 面向对象 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xht
1023 0
|
5天前
|
SQL 容灾 关系型数据库
[版本更新] PolarDB-X V2.4 列存引擎开源正式发布
[版本更新] PolarDB-X V2.4 列存引擎开源正式发布!
[版本更新] PolarDB-X V2.4 列存引擎开源正式发布
|
5天前
|
存储 关系型数据库 分布式数据库
数据管理的艺术:PolarDB开源版详评与实战部署策略(二)
PolarDB-PG是阿里云的一款云原生关系型数据库,100%兼容PostgreSQL,支持Oracle语法,采用Shared-Storage存储计算分离架构,提供极致弹性、毫秒级延迟的HTAP能力。具备高可用、高可靠和弹性扩展特性,支持单机、存储计算分离和X-Paxos三节点等多种部署形态。通过Docker可快速部署实例,包括单节点、一主一备和HTAP(一主两备)实例。此外,文章还介绍了在ECS上使用ESSD云盘搭建PolarDB-PG的详细步骤,适合开发和测试环境。
123103 14
|
5天前
|
运维 监控 Cloud Native
如何设计与构建 FinOps 流程、团队、体系与目标
企业 FinOps 实施不是一蹴而就的项目,如果您正在推进企业云原生 FinOps 落地,除了选择合适的技术手段,企业内部的流程和体系建设也尤为重要。
162570 12
|
5天前
|
分布式计算 Java API
Java8 Lambda实现源码解析
Java8的lambda应该大家都比较熟悉了,本文主要从源码层面探讨一下lambda的设计和实现。
162563 10
|
5天前
|
关系型数据库 Serverless 分布式数据库
PolarDB PostgreSQL版Serverless技术原理解读
数据库是现代企业IT系统中非常重要的一部分。在创建数据库时,客户往往需要比较保守地去配置数据库集群的资源,包括CPU、内存、存储以及连接数等多种参数配置,以确保业务能够在波峰和波谷都能平稳运行。在这种情况下,客户购买的集群资源在业务波谷时期会被闲置,导致整体成本偏高;而在业务压力增长阶段,集群资源又应对不足。Serverless数据库可以很好地解决这个问题。它能够让数据库集群资源随客户业务负载动态弹性扩缩,将客户从复杂的业务资源评估和运维工作中解放出来。 本文描述PolarDB PostgreSQL版Serverless的构建中, 如何实现弹得快、弹得准、弹得稳、弹得广的几个关键技术点。
75805 5
PolarDB PostgreSQL版Serverless技术原理解读
|
5天前
|
缓存 自然语言处理 JavaScript
万字长文深度解析JDK序列化原理及Fury高度兼容的极致性能实现
Fury是一个基于JIT动态编译的高性能多语言原生序列化框架,支持Java/Python/Golang/C++/JavaScript等语言,提供全自动的对象多语言/跨语言序列化能力,以及相比于别的框架最高20~200倍的性能。
168493 2
|
5天前
|
存储 关系型数据库 MySQL
数据管理的艺术:PolarDB开源版详评与实战部署策略(一)
PolarDB-X是阿里巴巴自研的高性能云原生分布式数据库,基于共享存储的Shared-nothing架构,支持MySQL生态,具备金融级高可用、分布式水平扩展、HTAP混合负载等能力。它通过CN(计算节点)和DN(存储节点)实现计算与存储分离,保证数据强一致性,并支持全局二级索引和多主多写。PolarDB-X开源版提供更高程度的定制化和控制权,适合追求技术自主性和成本优化的开发者。部署方式包括RPM包、PXD工具和Kubernetes,其中PXD工具提供了一键部署的便利性。
75100 14
|
5天前
|
NoSQL MongoDB 数据库
探寻MongoDB副本集选举机制 阿里云与MongoDB的DBaaS技术合作创新
阿里云连续第五年斩获MongoDB合作伙伴奖项,也是唯一获此殊荣的中国云厂商。一起学习MongoDB副本集的选举机制以及可能会出现的特殊情况。
探寻MongoDB副本集选举机制  阿里云与MongoDB的DBaaS技术合作创新