当前位置:首页 > 开发 > Web前端 > 前端 > 正文

页面元素选择器

发表于: 2013-11-26   作者:darrenzhu   来源:转载   浏览次数:
摘要: var simple = '.foo'; // Only asking for the class name on the element var simple = 'div.bar'; // Only asking for the tag/class name on the element 除了下面的Element/Attribute/Pseudo/CSS value选择器外,上面的基本选择
var simple = '.foo'; // Only asking for the class name on the element
var simple = 'div.bar'; // Only asking for the tag/class name on the element
除了下面的Element/Attribute/Pseudo/CSS value选择器外,上面的基本选择器也值得注意,其中div.bar是由两个选择器合成,一是tag选择器div,另一个是class选择器".bar",只需注意".bar"是class选择器, bar不是一个选择器.


Element Selectors:
* any element
E an element with the tag E
E F All descendent elements of E that have the tag F
E > F or E/F all direct children elements of E that have the tag F
E + F all elements with the tag F that are immediately preceded by an element with the tag E
E ~ F all elements with the tag F that are preceded by a sibling element with the tag E

Attribute Selectors:
The use of @ and quotes are optional. For example, div[@foo='bar'] is also a valid attribute selector.

E[foo] has an attribute "foo"
E[foo=bar] has an attribute "foo" that equals "bar"
E[foo^=bar] has an attribute "foo" that starts with "bar"
E[foo$=bar] has an attribute "foo" that ends with "bar"
E[foo*=bar] has an attribute "foo" that contains the substring "bar"
E[foo%=2] has an attribute "foo" that is evenly divisible by 2
E[foo!=bar] attribute "foo" does not equal "bar"

Pseudo Classes:
E:first-child E is the first child of its parent
E:last-child E is the last child of its parent
E:nth-child(_n_) E is the _n_th child of its parent (1 based as per the spec)
E:nth-child(odd) E is an odd child of its parent
E:nth-child(even) E is an even child of its parent
E:only-child E is the only child of its parent
E:checked E is an element that is has a checked attribute that is true (e.g. a radio or checkbox)
E:first the first E in the resultset
E:last the last E in the resultset
E:nth(_n_) the _n_th E in the resultset (1 based)
E:odd shortcut for :nth-child(odd)
E:even shortcut for :nth-child(even)
E:contains(foo) E's innerHTML contains the substring "foo"
E:nodeValue(foo) E contains a textNode with a nodeValue that equals "foo"
E:not(S) an E element that does not match simple selector S
E:has(S) an E element that has a descendent that matches simple selector S
E:next(S) an E element whose next sibling matches simple selector S
E:prev(S) an E element whose previous sibling matches simple selector S
E:any(S1|S2|S2) an E element which matches any of the simple selectors S1, S2 or S3
E:visible(true) an E element which is deeply visible according to Ext.dom.Element.isVisible

CSS Value Selectors:
E{display=none} css value "display" that equals "none"
E{display^=none} css value "display" that starts with "none"
E{display$=none} css value "display" that ends with "none"
E{display*=none} css value "display" that contains the substring "none"
E{display%=2} css value "display" that is evenly divisible by 2
E{display!=none} css value "display" that does not equal "none"

页面元素选择器

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
1、与后代选择器相比,子元素选择器只能选择作为某元素子元素的元素。 2、子元素选择器使用大于号"&
相邻元素选择器的定义是:可以选择紧接在另一个元素后的元素、并且这两个元素都有同样的父元素。由
一,向上遍历DOM树~获取父级元素 1、 parent(): parent()返回被选元素的直接父元素 2、parents():
摘自:http://www.ruanyifeng.com/blog/2009/09/find_element_s_position_using_javascript.html 网
一、获取网页的相对大小 网页上的每个元素,都有clientHeight和clientWidth属性,利用它们就可以得
通常selenium By 可以通过id,class,xpath,css等定位页面元素。 id 和class比较简单,此处略.... 介
通常selenium By 可以通过id,class,xpath,css等定位页面元素。 id 和class比较简单,此处略.... 介
最近一直在查找元素过滤之类的问题,今天正好有机会和大家讨论一下. 内容过滤选择器 根据元素中的字
本节再介绍几个觉得新颖的html5新增的页面元素。 1:details元素 这个元素实现的功能其实我们在网页
查了好多资料,发现还是不全,干脆自己整理吧,至少保证在我的做法正确的,以免误导读者,也是给自
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号