jquery笔记(常用技术)

1.选择器   
    (1)通配符:   
    $("input[id^='code']");//id属性以code开始的所有input标签   
    $("input[id$='code']");//id属性以code结束的所有input标签   
    $("input[id*='code']");//id属性包含code的所有input标签   
    (2)根据索引选择   
    $("tbody tr:even"); //选择索引为偶数的所有tr标签   
    $("tbody tr:odd");  //选择索引为奇数的所有tr标签   
    (3)获得jqueryObj下一级节点的input个数   
    jqueryObj.children("input").length;   
    (4)获得class为main的标签的子节点下所有<a>标签   
    $(".main > a");    
    (5)选择紧邻标签   
    jqueryObj.next("div");//获取jqueryObj标签的后面紧邻的一个div,nextAll获取所有   
    (6)根据索引选择   
    $("div").eq(0);//获取第一个div标签   
2.筛选器   
    (1)not   
    $("#code input:not([id^='code'])");//id为code标签内不包含id以code开始的所有input标签   
3.其他   
    (1)创建一个文本框   
    var inputObj = $("<input type='text'/>");   
    (2)取得文本框内容   
    jqueryObj.html();//html   
    jqueryObj.text();//纯文本   
    (3)取得标签属性值   
    jqueryObj.val();//取得标签value值   
    jqueryObj.attr("属性名如:name");//取得标签属性值   
    (4)向dom节点添加对象   
    inputObj.appendTo(jqueryObj); //将新创建的对象追加到jqueryObj里   
    inputObj.trigger("focus").trigger("select");//使文本框插入之后被选中
    (5)改变CSS样式
    inputObj.css({zIndex:3}); //给样式赋值
    inputObj.css("zIndex");
    (6)延迟   
    var timeoutId = setTimeout(function(){  },300);//延迟300毫秒,再执行函数   
    clearTimeout(timeoutId);//解除延迟,使未执行的函数不再执行   
    (7)定时间隔时间
    var timerId = setInterval(function(){  },300);//每间隔300毫秒,再执行函数  
    clearInterval(timerId);//解除定时,使未执行的函数不再执行 
    (8)动画
    inputObj.animate{"top":3,"left":3},300,function(){	});
4.事件   
    //处理文本框上的键盘操作   
    jqueryObj.keyup(function(event){   
        var keyCode = event.which;//获取当前按下键盘的键值,回车键为13   
    }   
    mouseover(fn),mouseout(fn)//鼠标移进,移出    
5.效果   
    show(),toggle(),slideDown(),slideUp(),slideToggle(),fadeIn(),fadeOut(),fadeTo()   
6.工具函数   
    $('#someField').val($.trim($('#someField').val()));//消除空格,语法:$.trim(value)   
7.常用函数封装   
    (function($){   
        $.extend({   
            //操作多个多选框   
            controlAllCheckBox:function(tableId,isSelectAll){   
                if(tableId==undefined){   
                    throw new Error("tableId 不能为空");               
                }   
                else{   
                    if(isSelectAll==undefined){   
                        throw new Error("isSelectAll 不能为空");               
                    }   
                    else{   
                        if(isSelectAll==true){   
                            $("#"+tableId+" :checkbox").each(function(){   
                                $(this).attr('checked','true');   
                            })   
                        }   
                        else{   
                            $("#"+tableId+" :checkbox").each(function(){   
                                $(this).attr('checked','');   
                            })   
                        }   
                    }   
                }   
            },   
            //取得选中的checkbox中的id   
            getCheckedIds:function(tableId){   
                var checkboxs = $("#"+tableId+" :checkbox:checked");   
                if(checkboxs.size()==0){   
                    throw new Error("没有选中记录");             
                }   
                else {   
                    var ids = "";   
                    checkboxs.each(function(){   
                        if(ids==''){   
                            ids+=$(this).attr('id');   
                        }   
                        else{   
                            ids+=","+$(this).attr('id');   
                        }   
                    })   
                    return ids;   
                }   
            }   
        })   
    })(jQuery);  

你可能感兴趣的:(html,jquery,css)