DOM遍历方法
为标题行添加样式
$(document).ready(function(){
$('th').parent().addClass('table-heading');
$('tr:not([th]):odd').addClass('odd');
$('tr:not([th]):even').addClass('even');
});
取得某一行的其他所有单元格
1.取得包含Henry的单元格,然后取得该单元格的所有同辈元素
$('tr:contains("henry")').siblings().addClass('height');
2.取得包含Henry的单元格,再取得他的父元素,然后找到该元素中包含的所有编号大于0的单元格(:gt 选择器选取 index 值高于指定数的元素)
$('td:contains("henry")').parent().find('td:gt(0)').addClass('height');
3.取得包含Henry的单元格,再取得他的父元素,找到该元素中包含的所有单元格,然后过滤这些单元格排除包含Henry的那一个
$('td:contains("henry")').parents().find('td').not(':contains("henry")').addClass("height");
4.取得包含Henry的单元格,再取得他的父元素,找到该元素包含的子元素中的第2个单元格,添加类,取消最后一次.find(),再查找该元素包含的子元素中的第3个单元格,添加类
$('td:contains("henry")').parent().find('td:eq(1)').addClass('height').end().find('td:eq(2)').addClass('height');
表格源码:
<table>
<tr>
<th>Title</th>
<th>Category</th>
</tr>
<tr>
<td>As you like it</td>
<td>comedy</td>
</tr>
<tr>
<td>All's well that ends well</td>
<td>comedy</td>
</tr>
<tr>
<td>hamlet</td>
<td>tragedy</td>
</tr>
<tr>
<td>mschrth</td>
<td>tragedy</td>
</tr>
<tr>
<td>romeo and juliet</td>
<td>tragey</td>
</tr>
<tr>
<td>herry part</td>
<td>history</td>
</tr>
<tr>
<td>henry</td>
<td>history</td>
<td>hkh</td>
<td>lmy</td>
</tr>
</table>
DOM遍历方法的更多相关文章
- jQuery基础(DOM篇,append(),after(),prepend(),insertAfter(),节点删除,遍历方法each())
1.DOM创建节点及节点属性 创建流程比较简单,大体如下: - 创建节点(常见的:元素.属性和文本) - 添加节点的一些属性 - 加入到文档中 流程中涉及的一点方法: - 创建元素:d ...
- 玩转DOM遍历——用NodeIterator实现getElementById,getElementsByTagName方法
先声明一下DOM2中NodeIterator和TreeWalker这两类型真的只是用来玩玩的,因为性能不行遍历起来超级慢,在JS中基本用不到它们,除了<高程>上有两三页对它的讲解外,谷歌的 ...
- Jquery中each的三种遍历方法
Jquery中each的三种遍历方法 $.post("urladdr", { "data" : "data" }, function(dat ...
- JavaScript、jQuery、fish的遍历方法(each、forEach)总结
起因 在工作中,需要在遍历的dom中找到第一个并做下操作然后退出遍历,我首先想到了用each方法,但由于无论是公用的jQuery组件还是公司的fish组件.我都忘记了怎么去退出遍历,所以就有了这篇帖子 ...
- JQuery总结:选择器归纳、DOM遍历和事件处理、DOM完全操作和动画 (转)
JQuery总结:选择器归纳.DOM遍历和事件处理.DOM完全操作和动画 转至元数据结尾 我们后台可能用到的页面一般都是用jquery取值赋值的,发现一片不错的文章 目录 JQuery总结一:选择器归 ...
- DOM遍历
前面的话 DOM遍历模块定义了用于辅助完成顺序遍历DOM结构的类型:Nodeiterator和TreeWalker,它们能够基于给定的起点对DOM结构执行深度优先(depth-first)的遍历操作. ...
- JS数组与对象的遍历方法大全
本文简单解析各种数组和对象属性的遍历方法: 原生for循环.for-in及forEach ES6 for-of方法遍历类数组集合 Object.key()返回键名的集合 jQuery的$.each() ...
- jquery中each的3种遍历方法
1.选择器+遍历 $('div').each(function (i){ i就是索引值 this 表示获取遍历每一个dom对象 }); 2.选择器+遍历 $('div').each(function ...
- jQuery 源码分析(十九) DOM遍历模块详解
jQuery的DOM遍历模块对DOM模型的原生属性parentNode.childNodes.firstChild.lastChild.previousSibling.nextSibling进行了封装 ...
随机推荐
- 去除行内(inline/inline-block)元素之间的间距
先展示一下,行内元素之间存在间距,实例代码如下: <style> div { color: #fff; padding: 25px 50px; } .inline-f00 { displa ...
- JQuery选择器转义说明
JQuery选择器 JQuery选择器规则, 借用了css1-3的规则(css选择器规则), 因为css本身也需要一套规则来索引DOM元素, 进而进行样式渲染,例如div.blue 表示目标DOM为 ...
- JQuery1.11版本对prop和attr接口的含义分离导致问题分析
问题背景 实验中, 在jquery1.7版本, attr("value") 和 val() 接口获取 input 控件的值, 都是一致的, 都是当前控件值. 但是 jquery1 ...
- hadoop datanode启动失败
问题导读: 1.Hadoop出现问题时,该如何入手查看问题?2.datanode无法启动,我们该怎么解决?3.如何动态加入DataNode或TaskTracker? 一.问题描述当我多次格式化文件系统 ...
- 获取Python安装目录
>>> import sys>>> path=sys.executable>>> print (path)C:\Users\jumz-G\AppD ...
- js作用域学习
代码解析至少分两步 1):查找var,function参数例如下面这个例子 a= 未定义 fn1={alert(2)}函数的话,是整个整体 2):逐行读代码:类似=+-%*等都是表达式,表达式可以改变 ...
- Js原生 双向数据绑定
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- .NET开发实战1-军队未出,粮草先行。
马上期末考试了,会想起这个学习的自己.一直都在一个人搞java的研究,C#课也没怎么去上.所以在这里想弥补一下自己没去上课的原因,也希望老师能够理解这个还在迷茫的我. 正所谓,军队未出粮草先行,所以我 ...
- AJAX-----10iframe模拟ajax文件上传效果原理2
在实际开发中其实我们可以给用户一些提示,比如上传成功或者上传失败,废话不多说,走码: <!DOCTYPE html> <html lang="en"> &l ...
- cmd运行sql server安装
cmd运行sql server安装 SQL2012非群集安装_更新到最新版本.bat setup.exe /UpdateSource=.\hotfix\Latest /ACTION="Ins ...