• jQuery 基础教程(第3版) ---第九章习题答案


    //第一题
    $(document).ready(function(){
        function stripe(){
            $('#news').find('tr.alt').removeClass('alt');
            $('#news tbody').each(function(){
                $(this).children(':visible').has('td').filter(
                    function(index){
                        return (index%3)==1;
                    }
                ).addClass('alt').end().filter(
                    function(index){
                        return (index%3)==2;
                    }
                ).addClass('alt-2');
            });
        }
        
        stripe();
        
        
        $('#topics a').click(function(){
            var topic = $(this).text();
            
            $('#topics a.selected').removeClass('selected');
            $(this).addClass('selected');
            
            $('#news').find('tr').show();
            if(topic!='All'){
                $('#news').find('tr:has(td)').not(function(){
                    return $(this).children(':nth-child(4)')
                            .text()==topic;
                
                }).hide();
            }
            
            stripe();
            return false;
            
        });
    });
    
    //第二题
    (function($){
        $.extend($.expr[':'],{
            containsExactly:function(element,index,matches,set){
                var value = matches[3];
                var x = $(element).text();
                if(value!=x){
                    return false
                }
                return true;
            }
        });
    })(jQuery);
    //可使用的调用方法
    $('#news td').click(function(){
        $(this).filter(':containsExactly("XXX")').addClass('YYY');
    });
    
    
    //第三题
    if(topic!='All'){
        //原代码
        $('#news').find('tr:has(td)').not(function(){
            return $(this).children(':nth-child(4)').text()==topic;
        }).hide();
        
        //新的
        $('#news').find('tr:has(td)').not(':containsExactly('+topic+')').hide();
        
    } 
    //第四题
    (function($){
        $.fn.grandparent=function(){
            var $current=$();
            this.each(function(){
                $current = $(this).parents();
            });
            return this.pushStack($current);
        }
    })(jQuery);
  • 相关阅读:
    小程序全局生命周期( 仅供了解 )
    iview表格render小案例2
    iview中表格根据条件渲染
    如何实现页面同时在移动端和pc端的兼容问题
    小程序页面中的生命周期( 仅供了解 )
    弹性盒基本属性
    elementUI实现分页效果+模糊搜索效果
    事件流 ---- 事件冒泡与事件捕获
    React生命周期
    数据库索引数据结构btree,b-tree和b+tree树
  • 原文地址:https://www.cnblogs.com/wanlxz/p/3477998.html
Copyright © 2020-2023  润新知