jQuery代码的14条改善技巧[译](3)
作者:暴风彬彬 来源:彬Go 发布时间:2009-12-02 10:02:00
标签:jQuery,优化,代码,技巧,选择器
6.在FireBug控制台记录jQuery
FireBug是我最喜欢用的一个浏览器扩展工具之一,这个工具可以让你快速的在可视化界面中了解当前页面的HTML+CSS+JavaScript,并在该工具下完成即时开发。作为jQuery或JavaScript开发人员,FireFox对于 记录你的JavaScript代码 也得到支持。
写入FireBug控制台的最简单方式如下:
console.log("hello world")
你也可以按照你希望的方式写一些参数:
console.log(2,4,6,8,"foo",bar)
你也可以编写一个小扩展来记录jQuery对象到控制台:
jQuery.fn.log = function (msg) {
console.log("%s: %o", msg, this);
return this;
};
对于这个扩展,你可以直接使用.log()方法来记录当前对象到控制台。
$('#some_div').find('li.source > input:checkbox')
.log("sources to uncheck")
.removeAttr("checked");
7.尽可能使用ID选择器
在使用jQuery之后,你会发现利用class属性来选择DOM元素变得相当简单。尽管如此,还是推荐大家尽量少用class选择器取而代之尽量多使用运行更快的ID选择器(IE浏览器下使用class选择器会在遍历整个DOM树之后返回相符的class包装集)。而ID选择器更快是因为DOM本身就有”天然的”getElementById这个方法,而class并没有。所以如果使用class选择器的话,浏览器会遍历整个DOM,如果你的网页DOM结构足够复杂,这些class选择器足矣把页面拖得越来越慢。让我们看看这段简单的HTML代码:
<div id="main">
<form method="post" action="/">
<h2>Selectors in jQuery</h2>
...
...
<input class="button" id="main_button" type="submit" value="Submit" />
</form>
</div>
//使用class来调用submit按钮要比使用绝对的ID选择器慢很多
var main_button = $('#main .button');
var main_button = $('#main_button');
8.善于利用jQuery链
jQuery链不但允许以简洁的方式写出强大的操作,而且提高了开发效率,因为它能够把多个命令应用到包装集,而不必重新计算包装集。从而你不用再这样写了:
<li>Description: <input type="text" name="description" value="" /></li>
$('#shopping_cart_items input.text').css('border', '3px dashed yellow');
$('#shopping_cart_items input.text').css('background-color', 'red');
$('#shopping_cart_items input.text').val("text updated");
取而代之你可以使用jQuery链来完成简便的操作:
var input_text = $('#shopping_cart_items input.text');
input_text.css('border', '3px dashed yellow');
input_text.css('background-color', 'red');
input_text.val("text updated");
//same with chaining:
var input_text = $('#shopping_cart_items input.text');
input_text
.css('border', '3px dashed yellow')
.css('background-color', 'red')
.val("text updated");
0
投稿
猜你喜欢
- 用户界面和用户体验(UI/UX)是任何产品成败的关键,尤其 Web,Web 是一种公开的,可以被任何人随时随地访问的特殊产品,用户的体验几乎
- 从今天起,我将陆续将 ppk on JavaScript 的读书心得发布到这个blog上。ppk是我所景仰的一位web开发者,原因无它,只是
- 步骤——1:定位在通过与客户,或与和客户接触的业务人员交流,做出一个准确的定位.定位的准确与否,虽然不能决定一定通过,但如果定位不准或相差太
- 问: 如果数据表中有时间字段,现在要迁移到其他时区的服务器上,该如何处理呢?答:在高版本的mysqldump中,新增了一个选项:--tz-u
- SQL Server有几个版本都在使用中——4.2, 6.0, 6.5, 7.0, 2000,以及2
- 可在图片连接后面加上宽和高,如:width="150" height="50"<h
- 当用户关闭cookie时,通过asp程序提示访客打开,源代码如下: Dim strCookie, strT
- 今天在使用MySQL时却不知如何处理,插入记录后不知怎样获得刚刚插入的id,查过文档后发现了select last_insert_id(),
- 本文介绍了两个asp实用的技巧,一是使用asp强制刷新页面,二是判断一个文件是否存在强制刷新网页 强制性刷新随机验证码 ,让随机验
- 当你在浏览网页时,看到一个很漂亮的特效,你查看源代码时看到的是一队乱码,那多扫兴呀!根据本人的研究,总结出了三种解密方法,与大家分享!!方法
- 1、为图片加入水印功能 Dim Jpeg Set Jpeg = Server.Create
- 研究网页编码很长时间了,因为最近要设计一个友情链接检测的VBS脚本,而与你链接的人的页面很可能是各种编码,以前采取的方法是:如果用GB231
- 如果您刚刚开始接触网页设计,是不是经常发生这样的问题呢?做好的网页在自己机器上可以正常浏览,而把页面传到服务器上就总是出现看不到图片,css
- kelon 问:格式如下:s="地,在要,大,奇功,不知,但是,不示"我想把它split分出來,变成数组來循环,但是不知
- asp过滤留言中脏话的代码例子<!--#include file="../conn/dbconn1.asp"--&
- 本文整理了3种鼠标经过图片,图片边框加粗或改变颜色的方法,希望大家喜欢。下面3中只是提供了一个方法,具体的鼠标经过图片的样式,你自己可以修改
- 申明如下:1 本着大家都学习的目的,我们只研究官方对应的4.0板本,请大家注意尊重开发者,保护知识产权,商业使用,请到官方购买正板!2 文章
- SQL语句更改表所有者SQL语句更改表所有者单个修改所有者sql语句如下:查询分析器输入:EXEC sp_changeobject
- jqGrid是一个优秀的基于jQuery的DataGrid框架,想必大伙儿也不陌生,网上基于ASP的资料很少,我提供一个,数据格式是json
- 如果你的网站涉及个人隐私或者机密性非公开的网页,怎样告诉禁止搜索引擎收录抓取,下面侯庆龙说下以下方法,希望对不想被搜索引擎收录抓取网站有所帮