本文实例总结了30个经典的jQuery代码开发技巧。分享给大家供大家参考。具体如下：
1. 创建一个嵌套的过滤器
.filter(“:not(:has(.selected))”) //去掉所有不包含class为.selected的元素
2. 重用你的元素查询
var allItems = $(“div.item”);
var keepList = $(“div#container1 div.item”);
<div>class names: $(formToLookAt + ” input:checked”).each(function() { keepListkeepList = keepList.filter(“.” + $(this).attr(“name”));
});
</div>
3. 使用has()来判断一个元素是否包含特定的class或者元素
//jQuery 1.4.* includes support for the has method. This method will find
//if a an element contains a certain other element class or whatever it is
//you are looking for and do anything you want to them.
$(“input”).has(“.email”).addClass(“email_icon”);
4. 使用jQuery切换样式
//Look for the media-type you wish to switch then set the href to your new style sheet
$(‘link[media=’screen’]’).attr(‘href’, ‘Alternative.css’);
5. 限制选择的区域
//Where possible, pre-fix your class names with a tag name
//so that jQuery doesn’t have to spend more time searching
//for the element you’re after. Also remember that anything
//you can do to be more specific about where the element is
//on your page will cut down on execution/search times
var in_stock = $(‘#shopping_cart_items input.is_in_stock’);
<ul id=”shopping_cart_items”>
<li> <input value=”Item-X” name=”item” type=”radio”> Item X</li>
<li> <input value=”Item-Y” name=”item” type=”radio”> Item Y</li>
<li> <input value=”Item-Z” name=”item” type=”radio”> Item Z</li>
</ul>
6. 如何正确使用ToggleClass
//Toggle class allows you to add or remove a class
//from an element depending on the presence of that
//class. Where some developers would use:
a.hasClass(‘blueButton’) ? a.removeClass(‘blueButton’) : a.addClass(‘blueButton’);
//toggleClass allows you to easily do this usinga.toggleClass(‘blueButton’);
7. 设置IE指定的功能
if ($.browser.msie) {
// Internet Explorer is a sadist.
}
8. 使用jQuery来替换一个元素
$(‘#thatdiv’).replaceWith(‘fnuh’);
9. 验证一个元素是否为空
if ($(‘#keks’).html()) {
