-
2-9 jQuery选择器之可见性筛选选择器 元素有显示状态与隐藏状态,jQuery根据元素的状态扩展了可见性筛选选择器:visible与:hidden 描述如下:tu 这2个选择器都是 jQuery 延伸出来的,看起来比较简单,但是元素可见性依赖于适用的样式 :hidden选择器,不仅仅包含样式是display="none"的元素,还包括隐藏表单、visibility等等 我们有几种方式可以隐藏一个元素: CSS display的值是none。 type="hidden"的表单元素。 宽度和高度都显式设置为0。 一个祖先元素是隐藏的,该元素是不会在页面上显示 CSS visibility的值是hidden CSS opacity的指是0 如果元素中占据文档中一定的空间,元素被认为是可见的。 可见元素的宽度或高度,是大于零。 元素的visibility: hidden 或 opacity: 0被认为是可见的,因为他们仍然占用空间布局。 不在文档中的元素是被认为是不可见的,如果当他们被插入到文档中,jQuery没有办法知道他们是否是可见的,因为元素可见性依赖于适用的样式 来自评论: $(":visible"): 是否可见 / $(":hidden"):是否隐藏 - 看不见的:display:none; width/height为0 (返回 0/1,看不见/隐藏 ) - 可以看见的:设置了opacity为0/visibility:hidden的 (返回1/0,看得见/没隐藏) 总结来说就是还占空间的就是可见的(不管看得见还是看不见),不占空间的就是隐藏的。查看全部
-
2-8 jQuery选择器之内容筛选选择器 基本筛选选择器针对的都是元素DOM节点,如果我们要通过内容来过滤,jQuery也提供了一组内容筛选选择器,当然其规则也会体现在它所包含的子元素或者文本内容上 内容过滤器描述如下表:tu 注意事项: :contains与:has都有查找的意思,但是contains查找包含“指定文本”的元素,has查找包含“指定元素”的元素 如果:contains匹配的文本包含在元素的子元素中,同样认为是符合条件的。 :parent与:empty是相反的,两者所涉及的子元素,包括文本节点 来自评论: $(".div:contains(':contains')") //查找所有class='div',并且内容包含'contains'的元素 $(".div:has(span)") //查找所有class='div',并且包含span元素的元素 $("a:parent") //选择有子元素或有文本内容的,即当了‘爹’的a元素 $("a:empty").text(":empty").css("border", "3px groove red"); //选择没有子元素或者没有文本内容的,即没有当‘爹’的a元素,增加一段文本与边框查看全部
-
2-7 jQuery选择器之基本筛选选择器 很多时候我们不能直接通过基本选择器与层级选择器找到我们想要的元素,为此jQuery提供了一系列的筛选选择器用来更快捷的找到所需的DOM元素。筛选选择器很多都不是CSS的规范,而是jQuery自己为了开发者的便利延展出来的选择器 筛选选择器的用法与CSS中的伪元素相似,选择器用冒号“:”开头,通过一个列表,看看基本筛选器的描述:tu 注意事项: :eq(), :lt(), :gt(), :even, :odd 用来筛选他们前面的匹配表达式的集合元素,根据之前匹配的元素在进一步筛选,注意jQuery合集都是从0开始索引 gt是一个段落筛选,从指定索引的下一个开始,gt(1) 实际从2开始 来自评论: $(".div:first") $(".div:last") $(".div:even") $(".div:odd") $(".aaron:eq(2)") $(".aaron:gt(3)") $(".aaron:lt(2)") $("input:not(:checked) + p") 分段解释: $("input") 1.找出所有的input $("input:not(:checked)") 2.找出所有没有被选中的input $("input:not(:checked) + p") 3.找出所有没有被选中的input的同级元素p标签 4."+"表示同级的意思查看全部
-
.html()拿到的是html文档,.text()拿到的是所匹配元素文本元素。 .html()里面是html文档的话即会解析html文档,里面是文本元素的话即会输出文本元素。 .text()里面是html文档的话即会输出原始HTML文档,里面是文本元素的话即会输出文本元素。查看全部
-
层级选择器都有一个参考节点,不能直接定位到指定的DOM元素上 类选择器,通过class定位的元素是可以合集,也可以单独选择,但是速度上不是最高效的查看全部
-
id是唯一的,每个id值在一个页面中只能使用一次。如果多个元素分配了相同的id,将只匹配该id选择集合的第一个DOM元素 元素选择器,通过元素名定位的元素是可以合集,也可以单独选择,但是速度上不是最高效的查看全部
-
层级选择器都有一个参考节点 后代选择器包含子选择器的选择的内容 一般兄弟选择器包含相邻兄弟选择的内容 相邻兄弟选择器和一般兄弟选择器所选择到的元素,必须在同一个父元素下查看全部
-
$( "element" ) 搜索指定元素标签名的所有节点,这个是一个合集的操作。同样的也有原生方法getElementsByTagName()函数支持查看全部
-
jQuery实现:nth-child(n)是严格来自CSS规范,所以n值是“索引”,也就是说,从1开始计数,:nth-child(index)从1开始的,而eq(index)是从0开始的查看全部
-
http://www.cnblogs.com/hyuq/p/4131200.html 转换为数字查看全部
-
选择器适用于复选框和单选框,对于下拉框元素, 使用 :selected 选择器 在某些浏览器中,选择器:checked可能会错误选取到<option>元素,所以保险起见换用选择器input:checked,确保只会选取<input>元素查看全部
-
:first只匹配一个单独的元素,但是:first-child选择器可以匹配多个:即为每个父级元素匹配第一个子元素。这相当于:nth-child(1) :last 只匹配一个单独的元素, :last-child 选择器可以匹配多个元素:即,为每个父级元素匹配最后一个子元素 如果子元素只有一个的话,:first-child与:last-child是同一个 :only-child匹配某个元素是父元素中唯一的子元素,就是说当前子元素是父元素中唯一的元素,则匹配 jQuery实现:nth-child(n)是严格来自CSS规范,所以n值是“索引”,也就是说,从1开始计数,:nth-child(index)从1开始的,而eq(index)是从0开始的 nth-child(n) 与 :nth-last-child(n) 的区别前者是从前往后计算,后者从后往前计算查看全部
-
:contains与:has都有查找的意思,但是contains查找包含“指定文本”的元素,has查找包含“指定元素”的元素 如果:contains匹配的文本包含在元素的子元素中,同样认为是符合条件的。 :parent与:empty是相反的,两者所涉及的子元素,包括文本节点查看全部
-
筛选选择器的用法与CSS中的伪元素相似,选择器用冒号“:”开头 注意事项: :eq(), :lt(), :gt(), :even, :odd 用来筛选他们前面的匹配表达式的集合元素,根据之前匹配的元素在进一步筛选,注意jQuery合集都是从0开始索引 gt是一个段落筛选,从指定索引的下一个开始,gt(1) 实际从2开始查看全部
-
$('div p') 选择所有div元素里面的p元素 $('div>p') 选择所有div元素里面的子元素P $('prev+next') 选取prev后面的第一个的div兄弟节点 $('.prev ~ div') 选取prev后面的所有的div兄弟节点查看全部
举报
0/150
提交
取消