1.当document文档就绪时执行JavaScript代码。
我们为什么使用jQuery库呢？原因之一就在于我们可以使jQuery代码在各种不同的浏览器和存在bug的浏览器上完美运行。
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
// Different ways to achieve the Document Ready event
// With jQuery
$(document).ready(function(){ /* ... */});
// Short jQuery
$(function(){ /* ... */});
// Without jQuery (doesn't work in older IE versions)
document.addEventListener('DOMContentLoaded',function(){
// Your code goes here
});
// The Trickshot (works everywhere):
r(function(){
alert('DOM Ready!');
})
function r(f){/in/.test(document.readyState)?setTimeout('r('+f+')',9):f()}
</script>
2.使用route。
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
var route = {
_routes : {}, // The routes will be stored here
add : function(url, action){
this._routes[url] = action;
},
run : function(){
jQuery.each(this._routes, function(pattern){
if(location.href.match(pattern)){
// "this" points to the function to be executed
this();
}
});
}
}
// Will execute only on this page:
route.add('002.html', function(){
alert('Hello there!')
});
route.add('products.html', function(){
alert("this won't be executed :(")
});
// You can even use regex-es:
route.add('.*.html', function(){
alert('This is using a regex!')
});
route.run();
</script>
3.使用JavaScript中的AND技巧。
使用&&操作符的特点是如果操作符左边的表达式是false，那么它就不会再判断操作符右边的表达式了。所以：
// Instead of writing this:
if($('#elem').length){
// do something
}
// You can write this:
$('#elem').length && log("doing something");
4. is()方法比你想象的更为强大。
下面举几个例子，我们先写一个id为elem的div。js代码如下：
// First, cache the element into a variable:
var elem = $('#elem');
// Is this a div?
elem.is('div') && log("it's a div");
// Does it have the bigbox class?
elem.is('.bigbox') && log("it has the bigbox class!");
// Is it visible? (we are hiding it in this example)
elem.is(':not(:visible)') && log("it is hidden!");
// Animating
elem.animate({'width':200},1);
// is it animated?
elem.is(':animated') && log("it is animated!");
