jQuery 子元素选择
对于如下代码片段 如何对河meishi这个div的子DIV呢?
<div id="vertical-Menu-meishi" class="J-nav-item">
<div id="yui_3_12_0_1_1387858313977_228" >
<div id="yui_3_12_0_1_1387858313977_227" ></div>
<div id="yui_3_12_0_1_1387858313977_424" ></div>
</div>
</div>
参考http://api.jquery.com/first-child-selector/
http://api.jquery.com/nth-child-selector/
不过上述都没有说明 :nth-child(2)
可以用在children()的括号中...
不过想想 :nth-child(2)
本身是选择器表达式 children('selector') 括号中也是选择器表达式
所以它就干脆没说
stackoverflow上又两个问答也很好的
http://stackoverflow.com/questions/4727263/jquery-get-second-child
http://stackoverflow.com/questions/5440792/getting-the-2nd-child-element
(后一篇中第一个回答的方案3 似乎行不通)
$("#yui_3_12_0_1_1387858313977_424").css('display', 'block');//ok
//表示的是获取#vertical-Menu-meishi下得第一个DIV元素
alert($("#vertical-Menu-meishi div:first-child").attr("id"));//ok
alert( ($("#vertical-Menu-meishi").children(':first-child')).attr("id"));//ok
//获取第一个子元素的第一个子元素
alert( $("#vertical-Menu-meishi").children(':first-child').children(':first-child').attr('id') );//ok
//获取第一个子元素的第二个子元素
alert( $("#vertical-Menu-meishi").children(':first-child').children(':nth-child(2)').attr('id') );//ok //或者使用下面的办法 感觉更加容易理解
//获取第一个子元素
alert( $("#vertical-Menu-meishi").children('div').eq(0).attr('id') );//ok
获取第一个子元素下的第二个子元素
alert( $("#vertical-Menu-meishi").children('div').eq(0).children('div').eq(1).attr('id') );//ok
显然后面几种方式更好 第一个的话 第一种形式 对于$(this)这样的表达式就无能为力啦
jQuery 子元素选择的更多相关文章
- jquery 子元素 后代元素 兄弟元素 相邻元素
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...
- jQuery——子元素筛选器
子元素筛选器 名称 :first-child JQ语法 jQuery( "selector:first-child" ) 说明 :first-child选择器用于匹配作为父元素的第 ...
- 一个样例看清楚JQuery子元素选择器children()和find()的差别
近期在我们的hybrid app项目开发中定位出了一个问题.通过这个问题了解下JQuery选择器find()和children()的差别.问题是这种:我们的混合app是一个单页面应用(main.htm ...
- jquery 子元素筛选选择器
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...
- jquery子元素选择器
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery子元素过滤选择器
:nth-child('索引值')//获取指定元素下的某个子元素的位置,索引从1开始: //偶数行 //$('li:nth-child(even)').addClass ...
- jquery子元素过滤器
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- jQuery内容过滤选择器与子元素过滤选择器用法实例分析
jQuery选择器内容过滤 一.:contains(text) 选择器::contains(text)描述:匹配包含给定文本的元素返回值:元素集合 示例: ? 1 2 $("div.mini ...
- 深入学习jQuery选择器系列第八篇——过滤选择器之伪子元素选择器
× 目录 [1]通用形式 [2]反向形式 [3]首尾元素 [4]唯一元素 前面的话 本文是子元素选择器的续篇,主要介绍关于nth-of-type()选择器的内容.该部分内容并非没有出现在<锋利的 ...
随机推荐
- wndows make images
配置文件/etc/xen/mywindows.内容如下 import os, re arch_libdir = 'lib' arch = os.uname()[4] if os.uname()[0] ...
- linux 使用ssh到远端并且使用while的坑
如果要使用ssh批量登录到其它系统上操作时,我们会采用循环的方式去处理,那么这里存在一个巨大坑,你必须要小心了. 现在是想用一个脚本获取远程服务器端/root下面的文件: #!/bin/bash ca ...
- [学习笔记]HTML5之canvas
虐了一下午的canvas 先撸了一个七巧板 <!doctype html> <html> <head> <meta charset="utf-8&q ...
- Foundation 框架 归档
一.使用XML属性列表归档 此方法适用于NSString.NSDictionary.NSarray.NSDate.NSnumber,其中atomically参数表示先将字典写入临时备份文件,成功之后, ...
- php开发中的一些常用统计的日期
<?php echo '<br>今天:<br>'; echo date("Y-m-d",strtotime("now")), &q ...
- CSS Select 标签取选中文本值
$("#userDep").find("option:selected").text()
- JetBrains PhpStorm 使用
· 在左侧显示当前文件位置 在左侧显示当前文件位置 alt + F1 在选择第1个在文件夹显示文件 在文件标签上 ctrl + 鼠标左键 或者 alt + F1 在选择第8个显示当前文件的函数,变量 ...
- LATEX使用之字体颜色深浅不一
今天用Ctex写论文,发现出来的pdf在屏幕上会出现字体颜色深浅不一的现象. google一下之后,在饮水思源bbs上找到了解决方法,用latex+dvitopdf来编译就不会有这个现象了. 另外,对 ...
- Vistual Studio 2010 调试无法进断点
系统是2003出现的问题 win8就没事 打sp1 补丁就行
- Tomcat 中会话超时的相关配置
QC同事提到似乎有时Tomcat的会话超时表现有问题,记录一下可能用到的配置. 1)超时时间的设定 tomcat的会话超时可以在多个级别上设置:tomcat实例级别.Web应用级别.s ...