jquery dom 遍历

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;
   

你可能感兴趣的:(jquery)