1. 交替为表格行添加样式
$(document).ready(function() {
$('tr:odd').addClass('odd'); /** odd is one class in css **/
$('tr:even').addClass('even');
/** The code can be rewrote as $('tr').filter(':odd').addClass('odd');
});
2. 为标题行添加样式
$(document).ready(function() {
$('tr').parent().addClass('table-heading');
$('tr:not([th]):even').addClass('even');
$('tr:not([th]):odd').addClass('odd');
$('td:contains("Herry")').addClass('highlight');
});
3. 为单元格添加样式
$(document).ready(function() {
/** next()方法只是取最接近的下一个同辈元素。**/
$('td:contains("Herry")').next().addClass('highlight');
/** 取得包含Herry的单元格,然后取得该单元格的所有同辈元素**/
$('td:contains("Herry")').siblings().addClass('highlight');
/**取得包含Herry的单元格,再取得他的父元素,然后找到该元素中包含的所有编号大于0的单元格(0是第一单元格)**/
$('td:contains("Herry")').parent().find('td:gt(0)').addClass('highlight');
/** 取得包含Herry的单元格,再取得它的父元素,找到该元素中包含的所有单元格,然后再过滤这些单元格排除包含Herry的那个**/ $('td:contains("Herry")').parent().find('td').not(':contains("Herry")').addClass('highlight');
/**取得包含Herry的单元格,再取得它的父元素,找到该元素中所包含的子元素的第二个单元格,取消最后一次find(),再查找该元素包含的子元素中的第三个单元格 **/
$('td:contains("Herry")').parent().find('td:eq(1)').addClass('highlight').end().find('td:eq(2)').addClass('highlight');
});
4. 访问DOM元素
var myTag = $('#my-id').get(0).tagName;
$(document).ready(function() {
$('tr:odd').addClass('odd'); /** odd is one class in css **/
$('tr:even').addClass('even');
/** The code can be rewrote as $('tr').filter(':odd').addClass('odd');
});
2. 为标题行添加样式
$(document).ready(function() {
$('tr').parent().addClass('table-heading');
$('tr:not([th]):even').addClass('even');
$('tr:not([th]):odd').addClass('odd');
$('td:contains("Herry")').addClass('highlight');
});
3. 为单元格添加样式
$(document).ready(function() {
/** next()方法只是取最接近的下一个同辈元素。**/
$('td:contains("Herry")').next().addClass('highlight');
/** 取得包含Herry的单元格,然后取得该单元格的所有同辈元素**/
$('td:contains("Herry")').siblings().addClass('highlight');
/**取得包含Herry的单元格,再取得他的父元素,然后找到该元素中包含的所有编号大于0的单元格(0是第一单元格)**/
$('td:contains("Herry")').parent().find('td:gt(0)').addClass('highlight');
/** 取得包含Herry的单元格,再取得它的父元素,找到该元素中包含的所有单元格,然后再过滤这些单元格排除包含Herry的那个**/ $('td:contains("Herry")').parent().find('td').not(':contains("Herry")').addClass('highlight');
/**取得包含Herry的单元格,再取得它的父元素,找到该元素中所包含的子元素的第二个单元格,取消最后一次find(),再查找该元素包含的子元素中的第三个单元格 **/
$('td:contains("Herry")').parent().find('td:eq(1)').addClass('highlight').end().find('td:eq(2)').addClass('highlight');
});
4. 访问DOM元素
var myTag = $('#my-id').get(0).tagName;