javascript - css3选择器和jq选择器的比较？

问题描述

问 题

css3的某个属性里
.p_f_color:first-of-type
{
background:#ff0000;
}

jq选择器
$(document).ready(function(){
$("div p").first().css('background','#ff0000');
});

小弟好奇两者的存在的区别//

解决方案

个人感觉区别主要还是在于浏览器的解析吧.

浏览器->解析HTML->构成DOM树____>构成渲染树(呈现树)->...
浏览器->解析CSS->CSS规则树 /

• CSS的选择器其实是在浏览器解析阶段提供信息用于构成渲染树.

• jq选择器,由于我学艺不精,还没读源码,也不太清楚.其中用到了各种正则表达式,但是也离不开HTML DOM才对.

• javascript的getElementByID应该是通过HTML DOM接口来进行DOM树的访问的.

要是说不同的话,其实本质CSS选择器是解析的规则,而JS选择器获取到的则是DOM树的节点.如果用js选择器对样式进行修改的话其实是通过DOM树->呈现树的关系进行修改的

动态变化
在发生变化时，浏览器会尽可能做出最小的响应。因此，元素的颜色改变后，只会对该元素进行重绘。元素的位置改变后，只会对该元素及其子元素（可能还有同级元素）进行布局和重绘。添加DOM节点后，会对该节点进行布局和重绘。一些重大变化（例如增大html元素的字体）会导致缓存无效，使得整个呈现树都会进行重新布局和绘制。

一点拙见...希望有大神能给出更加详尽和规范的解释
我觉得应该一看的资料:
http://coolshell.cn/articles/...
http://www.html5rocks.com/zh/...

这篇关于javascript - css3选择器和jq选择器的比较？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！