Deep Profiling jQuery Apps
程序员文章站
2024-03-12 19:10:32
...
如果我们看上了一个网页中使用了jQuery的应用,如何能够快速完整的分析出整个页面的jQuery code呢?之前除了一点一点查看源代码以外,没有其他好的方法。John Resig给我们带来一个分析jQuery code的插件，很方便的，点此下载
使用步骤如下：
Step 1: 复制站点代码,加入base href,加入插件
例如 http://www.abc.com/index.html中使用了jQuery，把此页面代码copy下来放到本地，然后修改代码。
before:
after:
Step 2: 打开页面，查看数据
这里我们需要使用firefox + firebug打开修改后的页面，在firebug的console视图中输入jQuery.displayProfile(); 这个时候，整个页面的事件信息就会出现在页面下方了。
使用步骤如下：
Step 1: 复制站点代码,加入base href,加入插件
例如 http://www.abc.com/index.html中使用了jQuery，把此页面代码copy下来放到本地，然后修改代码。
before:
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
...
<script src="/javascripts/hisapp.js"></script>
...
</head>
after:
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<base href="http://www.abc.com/"/>
...
<script src="/javascripts/hisapp.js"></script>
<!--或者手动使用全路径 <script src="http://www.abc.com/javascripts/hisapp.js"></script>-->
<!--这个文件要放在jQuery.js后面 -->
<script src="http://dev.jquery.com/~john/plugins/profile/jquery-profile.js"></script>
...
</head>
Step 2: 打开页面，查看数据
这里我们需要使用firefox + firebug打开修改后的页面，在firebug的console视图中输入jQuery.displayProfile(); 这个时候，整个页面的事件信息就会出现在页面下方了。