天天看点

jquery中后代元素和子元素的区别

对于刚学jquery的朋友来说,有时候会对jquery的层选择器$("ancestor descendant")和$("parent>child")产生一点理解上的问题。其实很简单,看完下面的例子你就会完完全全明白了。

<div>This is <strong>very</strong> important.</div>

<div>This is <em>really <strong>very</strong></em> important.</div>

以上是html。运行后在浏览器里是看到

This is  very important. This is  really very important.  

这样的样式,为了容易看到效果,我们不妨就尝试用添加css颜色来试一下

如果运行$("div strong").css("color","red");就是把div的后代元素strong变为红色。运行后是

This is  very important. This is  really very important.     如果运行$("div>strong").css("color","blue");就是把div的子元素strong变为蓝色。运行后是   This is  very important. This is  really very important.

说明:后代元素是之后的所有元素;子元素是之后的元素。

比如: 张三和父亲、爷爷之间的关系可以如下表述:

爷爷的后代元素是:张三和父亲; 爷爷的子元素是:父亲。