0 0

通过子元素选择器,为什么不能选择Table下面的所有tr?0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head style="height:100%">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/cupertino/jquery-ui.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.js"></script> 
<script>
	$(function() {		
		$("#tbl > tr").each(function(){
			alert($(this).text());			
		});				
	});
</script>

</head>
<body style="margin:0px">
<table id="tbl" width="595" border="1" align="center" cellpadding="1" cellspacing="1" bordercolor="red">
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
	</tr>
	<tr>
		<td>4</td>
		<td>5</td>
		<td>6</td>
	</tr>
	<tr>
		<td>7</td>
		<td>8</td>
		<td>9</td>
	</tr>
</table>
</body>
</html>

 

上面这段代码,没法通过$("#tbl > tr")这个子元素选择器查找到所有的tr,这是为什么呢?

 

2013年5月31日 10:01

5个答案 按时间排序 按投票排序

0 0

页面会自动生成tbody,使用>的选择器不能找到直接子类tr

2013年6月18日 11:35
0 0

[color=blue][/color]jQuery 选择器里没有 $("#tbl > tr") 这种形式,就直接用 $("#tbl tr") 就好了。http://www.w3school.com.cn/jquery/jquery_ref_selectors.asp 这是有关 jQuery 选择器的内容,你可以看看。

2013年6月02日 17:20
0 0

jQuery文档 写道
Selects all direct child elements specified ...

所以必须是直接子元素。
table的直接子元素是thead,tbody,tfoot。如果你什么也不写默认是tbody。

2013年5月31日 14:38
0 0

如果你table里面不会嵌套table,直接简单点$("#tbl tr")

2013年5月31日 12:45
0 0

$("#tbl >tbody> tr")

2013年5月31日 10:10

相关推荐

    jq 隐藏table中的tr或td

    总结起来,隐藏table中的tr或td在jQuery中是通过选择器定位元素并调用`hide()`方法实现的。结合事件处理,如`mouseover`,可以实现动态的隐藏效果。理解jQuery的选择器和事件处理是掌握此类操作的关键。

    JQuery选择器帮助文档

    2. **子元素选择器**:使用`&gt;`来选取父元素的直接子元素。 - 示例:`$(".myList &gt; li")`会选择CSS类名为`myList`的元素中的直接子元素`&lt;li&gt;`。 3. **相邻兄弟选择器**:使用`+`来选取紧跟在另一个元素后的兄弟元素...

    举例讲解CSS的子元素选择器用法

    值得注意的是,后代选择器和子元素选择器的区别在于它们的层级限定不同,后代选择器不受层级限制,而子元素选择器只在直接子层级内寻找元素。 使用子元素选择器可以提高CSS样式的精确度,减少不相关的样式被应用到...

    获取table中某个td的值

    如果td的位置是相对固定的,也可以通过遍历其父元素的子节点来获取。例如,获取特定tr下的第二个td: ```javascript var trElement = document.querySelector('tr'); // 假设我们已经知道tr元素 var tdValue = ...

    jQuery 选择器详细列表

    4. **元素选择器**:`element` 选取指定类型的元素,如 `$("p")` 会选取所有的 `&lt;p&gt;` 元素。 5. **组合选择器**: - `s1, s2, s3` 用于选取多个独立的选择器,例如 `$("th, td, .intro")` 会选取所有的 `&lt;th&gt;`、`...

    利用CSS控制表格table的交替颜色

    为了实现行的交替着色,我们可以使用`:nth-child(odd)`和`:nth-child(even)`选择器,它们分别用于匹配父元素的奇数和偶数子元素。对于更复杂的样式,如同时考虑行和列的交替颜色,还可以结合使用`sectionRowIndex`和...

    CSS.table.rar_Table_css table_table css_表格css

    - `:nth-child(n)`:伪类选择器,选取父元素的所有子元素中的第n个元素。 - `:nth-of-type(n)`:同上,但只选取特定类型的子元素。 3. **表格样式**: - `border`: 设置表格边框的宽度、样式和颜色。 - `border...

    正则取html中table中td中的值

    `&lt;table&gt;`标签定义了一个表格,而`&lt;tr&gt;`(表格行)和`&lt;td&gt;`(表格数据)是其子元素。`&lt;td&gt;`通常包含表格中的实际数据。因此,我们的目标是找到所有`&lt;td&gt;`标签并提取它们之间的内容。 1. **正则表达式基础** - **...

    jquery实现递归tr子节点.zip

    在这个例子中,`recursiveTrTraversal`函数首先会处理传入的tr元素,然后查找其所有直接子tr。如果有子tr,就对每个子tr调用自身,进行深度遍历。这使得我们可以访问到表格的任意层级,无论其结构有多复杂。 在...

    jquery查找父元素、子元素(个人经验总结)

    你可以通过提供一个选择器来限制返回的元素。例如,`$(this).parents('div')`将返回所有上层的`&lt;div&gt;`元素。 3. `parent()`:这个方法返回直接的父元素,作为一个jQuery对象。如果需要特定的父元素,可以使用选择器...

    jQuery树形选择器代码.zip

    接下来,为了实现表格化,我们可以利用HTML的`&lt;table&gt;`、`&lt;tr&gt;`、`&lt;td&gt;`等元素,将每个节点转化为一行,其子节点作为子行。这通常需要再次遍历整个树结构,确保每个节点在表格中的正确位置。表格化的好处在于它可以...

    jquery遍历table的tr获取td的值实现方法

    本文涉及到了多种jQuery选择器的使用,包括对元素的直接选择和通过父元素选择子元素。除了遍历表格数据,还展示了如何为元素绑定事件,例如点击事件。这些是jQuery中重要的知识点,它们提供了与用户交互和动态操作...

    jquery 中多条件选择器,相对选择器,层次选择器的区别

    在实际使用时,一定要注意选择器表达式中的逗号和空格不能多也不能少,否则可能无法正确选择到元素。 接下来是相对选择器。相对选择器在指定选择器时会根据某个相对元素进行查找。当我们想在特定的上下文中进行元素...

    获取多选table选中行中的单元格内容

    对于每个多选中行的`&lt;tr&gt;`元素,可以进一步遍历其子元素(即`&lt;td&gt;`),使用`innerText`或`textContent`属性获取单元格内的文本内容。如果需要处理特定列的数据,可以使用`cellIndex`属性确定当前单元格在行中的位置...

    sumalljiedian.rar_Table

    在`&lt;table&gt;`内部,可以包含多个`&lt;tr&gt;`(表格行)、`&lt;th&gt;`(表头单元格)和`&lt;td&gt;`(数据单元格)等子元素。 3. **Tr元素**: `&lt;tr&gt;`代表表格行,每个`&lt;tr&gt;`元素包含一系列`&lt;td&gt;`或`&lt;th&gt;`元素,它们在水平方向上并排...

    Jquery + CSS 制作条纹table表格

    `:nth-child()`允许我们根据元素的相对位置应用样式,例如`:nth-child(odd)`会选择所有奇数索引的子元素,`:nth-child(even)`则选择偶数索引的子元素。 实现步骤如下: 1. **HTML结构**:首先,确保你的HTML表格...

    JS手动改变table的宽度

    它是网页中用于组织数据的结构化组件,可以包含行(`&lt;tr&gt;`)、列(`&lt;th&gt;`或`&lt;td&gt;`)等子元素。默认情况下,表格的宽度由其内容决定,但我们可以使用CSS或JavaScript来控制这个属性。 ### 使用JavaScript改变table的...

    jquery 笔记(自己学习jquery整理好的)

    **功能:** 选取所有包含`&lt;a&gt;`标签的`&lt;li&gt;`子元素,并为其添加一个名为`myClass`的类。 **分析:** - `:has()`选择器用于选取包含指定子元素的元素。 **示例代码:** ```javascript $("ul li ul li:has(a)")....

    jQuery子属性过滤选择器用法分析

    `:only-child`选择器用于选取那些没有兄弟元素的子元素。当一个元素是其父元素的唯一子元素时,`:only-child`选择器就会匹配它。以下代码中,`$("div h3:only-child")`将选取所有`&lt;div&gt;`元素内的唯一`&lt;h3&gt;`子元素,...

Global site tag (gtag.js) - Google Analytics