JavaScript学习要点(十)

众多JS库中最常用的一项功能就是通过CSS选择符查询DOM文档取得元素的引用,从而抛弃了getElementById()和getElementByName()

querySelector()方法接收一个CSS选择符,返回与该模式匹配的第一个元素,没找到则返回Null

//取得类为”button”的第一个图像元素
var img = document.body.querySelector(“img.button”)

querySelectorAll()方法接收的参数和上一个方法一样,都是CSS选择符,但返回的是一个NodeList实例,类似于一组元素的快照,而不是不断对文档进行搜索的动态查询来避免性能问题

matchesSelector()方法接收CSS选择符,如果调用元素与该选择符匹配,返回true,否则返回false

对于元素遍历,DOM元素后添加了这五个属性:
childElementCount:返回子元素(不包括文本节点和注释)的个数
firstElementChild:指向第一个元素,firstChild的元素版
lastElementChild、previousElementSibling、nextElementSibling同理

HTML5围绕如何使用新增标记定义了大量JavaScriptAPI
getElementByClassName()接收一个参数,即一个包含一或多个类名的字符串,返回指定类的所有元素的NodeList
classList属性可被用来添加删除和替换类名,该属性的方法有add() contain() remove() toggle()

document.activeElement这个属性始终会引用DOM中当前获得了焦点的元素,元素获得焦点的方式有页面加载\用户输入和在代码中调用focus()方法
document.hasFocus()用于确定文档是否获得了焦点
document.readyState属性用来判断判断文档在loading还是complete
head属性用来引用文档的<head>元素
charset属性表示文档中实际使用的字符集,也可用来指定新字符集例如utf-16
读模式下innerHTML属性返回与调用元素的所有子节点对应的HTML标记 在写模式下,innerHTML会根据制定的值创建新的DOM树,然后用这个DOM树完全替换调用元素原先的所有子节点
读模式outerHTML返回调用它的元素以及所有子节点的HTML标签 写模式outerHTML会根据制定的HTML字符串创建新的DOM子树,然后用它完全替换调用元素

在HTML5中选择了scrollIntoView()方法作为标准方法用于页面的滚动,对一个HTML元素调用时传入true或者不传入参数,那么窗口滚动后会让元素的顶部与视口顶部尽可能平齐,如果传入false调用元素会尽可能全部出现在视口中,不过顶部不一定平齐








  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值