jQuery中的一些小技巧

 
 
list item 1
list item 2
list item 3

 $("ul").click(function(event) { var $target = $(event.target); if ( $target.is("li") ) { $target.css("background-color", "red"); } });

 // 是不是一个div elem.is('div') && console.log("it's a div"); // 是不是有包含(也可以有其他类名)bigbox的类名的元素? elem.is('.bigbox') && console.log("it has the bigbox class!"); // 是不是隐藏的? elem.is(':not(:visible)') && console.log("it is hidden!"); 

 elem.animate({'width':200},1000); // 是否正在动画 elem.is(':animated') && console.log("it is animated!"); 

 elem.animate({'width':200},1000); // 是否正在动画 elem.is(':animated') && console.log("it is animated!"); 

 jQuery.fn.exists = function(){ return this.length > 0; } console.log($('#elem').exists() ? "exists!" : "doesn't exist!"); 

 $('li','#firstList').each(function(){ console.log($(this).html()); });

 $('
',{ "class": "bigBlue", "css": { "background-color":"purple" }, "width" : 20, "height": 20, "animate" : {  // 可以设置div的动画效果 "width": 200, "height":50 } }).appendTo('#result');

 
 
 
 
No
No
No

 breakfast.find('.eggs').text('Yes').end() // back to breakfast .find('.toast').text('Yes').end().find('.juice').toggleClass('juice coffee').text('Yes');

 $(function(){ $(document).on("contextmenu",function(e){ e.preventDefault(); }); }); 

 var elem = $('#elem'); for(var i = 0; i <100; i++){ elem.append('
element '+i+'
'); }

 var elem = $('#elem'), arr = []; for(var i = 0; i <100; i++){ arr.push('
element '+i+'
'); } elem.append(arr.join(''));

 var url = 'http://tutorialzine.com/books/jquery-trickshots?trick=12&&abc=123#comments'; var a = $('',{ href: url }); console.log(url); console.log('Host name: ' + a.prop('hostname')); //Host name: tutorialzine.com console.log('Path: ' + a.prop('pathname')); //Path: /books/jquery-trickshots console.log('Query: ' + a.prop('search')); //Query: ?trick=12&&abc=123 console.log('Protocol: ' + a.prop('protocol')); //Protocol: http: console.log('Hash: ' + a.prop('hash')); //Hash: #comments

 $('#pancakes li').eq(0).remove(); $('#pancakes li').eq(1).remove(); $('#pancakes li').eq(2).remove();

 //第二种 var pancakes = $('#pancakes li'); pancakes.eq(0).remove(); pancakes.eq(1).remove(); pancakes.eq(2).remove(); //第三种 pancakes.eq(0).remove().end().eq(1).remove().end().eq(2).remove().end(); 

 var press = $('#press'); press.on('click',function(e, how){ how = how || ''; alert('The buton was clicked ' + how + '!'); }); press.trigger('click'); press.trigger('click',['fast']); 

 JumpPunchClickClear

 var button1 = $('#button1'), button2 = $('#button2'), button3 = $('#button3'), clear = $('#clear'), div = $('#eventDiv'); div.on({ jump : function(){ alert('Jumped!'); }, punch : function(e,data){ alert('Punched '+data+'!'); }, click : function(){ alert('Simulated click!'); } }); button1.click(function(){ div.trigger('jump'); }); button2.click(function(){ // Pass data along with the event div.trigger('punch',['hard']); }); button3.click(function(){ div.trigger('click'); }); clear.click(function(){ //some clear code }); 

 // Define some variables var ball = $('
').appendTo('body'), startPosition = {}, elementPosition = {}; // Listen for mouse and touch events ball.on('mousedown touchstart',function(e){ e.preventDefault(); // Normalizing the touch event object e = (e.originalEvent.touches) ? e.originalEvent.touches[0] : e; // Recording current positions startPosition = {x: e.pageX, y: e.pageY}; elementPosition = {x: ball.offset().left, y: ball.offset().top}; // These event listeners will be removed later ball.on('mousemove.rem touchmove.rem',function(e){ e = (e.originalEvent.touches) ? e.originalEvent.touches[0] : e; ball.css({ top:elementPosition.y + (e.pageY - startPosition.y), left: elementPosition.x + (e.pageX - startPosition.x), }); }); }); ball.on('mouseup touchend',function(){ // Removing the heavy *move listeners ball.off('.rem'); }); 

 Go To Google

 $('#goToGoogle').click(false);

 var press = $('#press'); press.on('click',function(){ return 'Hip'; }); press.on('click',function(e){ console.log(e.result + ' Hop!'); }) //控制台输出: HipHop! 

 $.when($.get('assets/misc/1.json'), $.get('assets/misc/2.json')).then(function(r1, r2){ console.log(r1[0].message + " " + r2[0].message); })

 var contentDivs = $('.content'); contentDivs.eq(0).load('1.txt'); contentDivs.eq(1).load('1.html #header');

 var ip = '119.75.218.70', api = 'http://freegeoip.net/json/' + ip + '?callback=?'; $.getJSON(api, function(r){ console.log('How is the weather in ' + r.city + ', ' + r.country_name + '?'); }); 

 (function($){ var c = 1; $.fn.count = function(){ log(c++); return this; }; })(jQuery); $(document).count(); $('body').count().count();