1.创建一个嵌套的过滤器
1.$(jquery).filter(":not(:has(.selected))") //去掉所有不包含class为.selected的元素
2.使用has()来判断一个元素是否包含特定的class或者元素
1.$("input").has(".email").addClass("email_icon");//如果class是email的，就添加email_iocn的class
3.使用jQuery切换样式
1.$('link[media='screen']').attr('href', 'Alternative.css');
4.限制选择的区域
1.var in_stock = $('#myid input.myclass');//找到id=myid元素里class=myclass的输入框
5.正确使用ToggleClass
不使用情况：
1.a.hasClass('blueButton') ? a.removeClass('blueButton') : a.addClass('blueButton');
使用ToggleClass
1.a.toggleClass('blueButton');
6.浏览器判断
1.if($.browser.msie && $.browser.version > 6) {
//如果是IE6后的版本...
}
7.查找一个元素的索引
1.$("ul > li").click(function () {
2. var index =
$(this).prevAll().length;
3.});
8.使用jQuery预加载图片
1.$.preloadImages('image1.gif', '/path/to/image2.png', 'some/image3.jpg');
9.自动的滚动到页面特定区域
1.$('.area_name').autoscroll();
10. 关闭右键的菜单
1.$(document).bind('contextmenu',function(e){
return false; });
11.判断一个元素是否存在
1.if($('#someDiv').length) {//存在}
12.判断一个元素是否为空
1.if($('#keks').html()) { //为空}
13.判断鼠标的左右键点击
1.$("#someelement").live('click', function(e) {
2. if( (!$.browser.msie
&& e.button == 0) || ($.browser.msie && e.button == 1) ) {
3. alert("左键点击");
4. }
5. else if(e.button == 2)
6. alert("右键点击");
7.});
14. 显示或者删除输入框的缺省值
01.$(".swap").each(function(i){
02. $(this).focusin(function(){
03. if ($(this).val() == "请输入") {
04. $(this).val("");
05. }
06. }).focusout(function(){
07. if ($.trim($(this).val()) == "") {
08. $(this).val("请输入");
09. }
10. });
11.});
15.指定时间后自动隐藏或者关闭元素
1.$(".mydiv").delay(5000).hide('blind', {},
500);
16.动态创建元素到DOM
1.varnewgbin1Div = $('');
2.newgbin1Div.attr('id','gbin1.com').appendTo('body');
17.使用jQuery克隆元素
1.varcloned = $('#gbin1div').clone();
18.元素屏幕居中
1.jQuery.fn.center = function () {
2. this.css('position','absolute');
3. this.css('top', ( $(window).height() - this.height() ) / +$(window).scrollTop()
+ 'px');
4. this.css('left', ( $(window).width() - this.width() ) / 2+$(window).scrollLeft()
+ 'px');return this;
5.}
6.$('#gbin1div').center();
19.剔除元素中的HTML
01.(function($) {
02. $.fn.stripHtml = function() {
03. var regexp =
/<("[^"]*"|'[^']*'|[^'">])*>/gi;
04. this.each(function() {
05. $(this).html(
06. $(this).html().replace(regexp,"")
07. );
08. });
09. return $(this);
10. }
11.})(jQuery);
12.$('p').stripHtml();
20.
使用closest来得到父元素
1.$('#searchBox').closest('div');
21.使用firebug来记录jQuery事件
1.jQuery.log =
jQuery.fn.log = function (msg) {
2. if (console){
3. console.log("%s:
%o", msg, this);
4. }
5. return this;
6.};
7.$('#someDiv').hide().log('div hidden').addClass('someClass');
22.点击链接强制弹出新窗口
1.Query('a.popup').live('click',
function(){
2. newwindow=window.open($(this).attr('href'),'','height=200,width=150');
3. if (window.focus)
{newwindow.focus()}
4. return false;
5.});
23.点击链接强制打开新标签页
1.jQuery('a.newTab').live('click',
function(){
2. newwindow=window.open($(this).href);
3. jQuery(this).target = "_blank";
4. return false;
5.});
24.取得鼠标的X和Y坐标
1.$(document).mousemove(function(e){
2.$(document).ready(function() {
3.$().mousemove(function(e){
4.$('#XY').html("Gbin1 X Axis : " + e.pageX + " | Gbin1 Y Axis " + e.pageY);
5.});
6.});
25.解析XML
1.function parseXml(xml) {
2. //find every Tutorial and print the author
3. $(xml).find("Tutorial").each(function()
4. {
5. $("#output").append($(this).attr("author")
+ "");
6. });
7.}
26.判断一个图片是否加载完全
1.$('#theGBin1Image').attr('src', 'image.jpg').load(function() {
2.alert('This Image Has Been
Loaded');
3.});