84669인 학습
152542인 학습
20005인 학습
5487인 학습
7821인 학습
359900인 학습
3350인 학습
180660인 학습
48569인 학습
18603인 학습
40936인 학습
1549인 학습
1183인 학습
32909인 학습
比如,<a class='my-class' name='my-name' src='segmentfault.com'>sth</a>,如果用.my-class或者a要快于[name='my-name'],虽然前两者能用到浏览器的原生函数,但是原生函数不也是要对dom tree做深度优先遍历么,为什么后者要慢?
<a class='my-class' name='my-name' src='segmentfault.com'>sth</a>
.my-class
a
[name='my-name']
我也来用学生梗!
id是学生的学生证;tagname是学生的班级;class是学生的社团;name是学生校服上的铭牌编号。
班级是必备属性,学生入校时必须隶属于一个班级(对应标签的tagname) 学生证号是学生的唯一识别名,不允许重复,但允许非本校学生登记后跟班旁听(对应标签的id) 社团是学生可选的项目,相同兴趣爱好的学生可以加入同个社团。可以加入多个社团也可以一个不加(对应标签的class) 班级、学生证、社团都会在学校档案中列入花名册。(对应dom树构建完成后,tagname、id、class会单独列入索引,可以被ByTagName\ByClassName\ById方法读取)
学校的校规比较松,校服不是必须穿的(对应标签的name,本质上和其它属性一个地位)。
现在开始点名: 报学生证号:直接花名册查,学生证号是XXX的,人叫OO,XX班的!方便快捷! 报班级号:直接查班级名册,这个班有这些人上课,方便快捷! 报社团名:直接查社团名册,这个社团登记了XXX人,方便快捷!
报校服铭牌号:所有学生都来操场排队站好!一个一个来!你没穿校服,下一个!你也没穿校服,下一个……哦,你穿了,但号码不对,下一个……好的,你穿校服了,号码也对,出列!下一个…… 天都要黑了好吗!!!
不知道可不可以这样解释。
A老师上课点名,直接按照学生表喊出名字,点到的同学直接站起来答到。 B老师上课点名,根据学生表里的名字或座位号之类的一个个对照看看来没来。
哪位老师点的快呢?
tag和class都使用了原生Javascript选择器,其中的tag兼容性更强,IE9以下的getElementByClassName不被支持,得通过其它方式实现。
DOM树的深度什么我不懂,只知道浏览器没有原生支持属性选择,现代浏览器中可以通过querySelectorAll()(jQuery的选择器sizzle里是这么写的)拿到属性选择的结果,但速度没有上面两个块,古老的浏览器要遍历所有DOM逐一判断,更慢。
了解更深只能去看浏览器的实现了,单从Js上猜已经没意思了
我也来用学生梗!
id是学生的学生证;tagname是学生的班级;class是学生的社团;name是学生校服上的铭牌编号。
班级是必备属性,学生入校时必须隶属于一个班级(对应标签的tagname)
学生证号是学生的唯一识别名,不允许重复,但允许非本校学生登记后跟班旁听(对应标签的id)
社团是学生可选的项目,相同兴趣爱好的学生可以加入同个社团。可以加入多个社团也可以一个不加(对应标签的class)
班级、学生证、社团都会在学校档案中列入花名册。(对应dom树构建完成后,tagname、id、class会单独列入索引,可以被ByTagName\ByClassName\ById方法读取)
学校的校规比较松,校服不是必须穿的(对应标签的name,本质上和其它属性一个地位)。
现在开始点名:
报学生证号:直接花名册查,学生证号是XXX的,人叫OO,XX班的!方便快捷!
报班级号:直接查班级名册,这个班有这些人上课,方便快捷!
报社团名:直接查社团名册,这个社团登记了XXX人,方便快捷!
报校服铭牌号:所有学生都来操场排队站好!一个一个来!你没穿校服,下一个!你也没穿校服,下一个……哦,你穿了,但号码不对,下一个……好的,你穿校服了,号码也对,出列!下一个……
天都要黑了好吗!!!
不知道可不可以这样解释。
A老师上课点名,直接按照学生表喊出名字,点到的同学直接站起来答到。
B老师上课点名,根据学生表里的名字或座位号之类的一个个对照看看来没来。
哪位老师点的快呢?
tag和class都使用了原生Javascript选择器,其中的tag兼容性更强,IE9以下的getElementByClassName不被支持,得通过其它方式实现。
DOM树的深度什么我不懂,只知道浏览器没有原生支持属性选择,现代浏览器中可以通过querySelectorAll()(jQuery的选择器sizzle里是这么写的)拿到属性选择的结果,但速度没有上面两个块,古老的浏览器要遍历所有DOM逐一判断,更慢。
了解更深只能去看浏览器的实现了,单从Js上猜已经没意思了