当前位置:  编程技术>WEB前端

本页文章导读:

    jquery $.ajax相关用法分享       代码如下: $.ajax({ type: "GET", url: "Services/EFService.svc/Members", data: "{}", contentType: "application/json; charset=utf-8", dataType: "json", success: function (data) { // Play with returned data in JSON format }, error: function (msg) { ......

    灵活应用js调试技巧解决样式问题的步骤分享       由于种种原因，例如：代码逻辑复杂、时间久了遗忘处理细节、或者根本就是接手修改别人遗留的bug，在这种情况下，debug就会变成一件头疼的事情。 在此分享一些JS调试方面的技巧，针对......

    3款实用的在线JS代码工具(国外)       1. 压缩工具 用于在线压缩你的JS代码，它有一个选项“Include latest jquery.min.js”，这对于提升速度非常有用。 推荐理由：缩小代码 = 更小的文件大小 = 更快的网页加载......

[1]jquery $.ajax相关用法分享

    来源: 互联网  发布时间: 2013-11-24

代码如下:

$.ajax({
type: "GET",
url: "Services/EFService.svc/Members",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
// Play with returned data in JSON format
},
error: function (msg) {
alert(msg);
}
});

全局事件是每次的Ajax请求都会触发的，它会向DOM中的所有元素广播，在上面 getScript() 示例中加载的脚本就是全局Ajax事件。全局事件可以如下定义：

代码如下:

$("#loading").ajaxStart(function(){
$(this).show();
});

我们可以在特定的请求将全局事件禁用，只要设置下 global 选项就可以了：

代码如下:

$.ajax({
url: "test.html",
global: false,// 禁用全局Ajax事件. // ... });

下面是jQuery官方给出的完整的Ajax事件列表：
ajaxStart (Global Event)
This event is broadcast if an Ajax request is started and no other Ajax requests are currently running.
beforeSend (Local Event)
This event, which is triggered before an Ajax request is started, allows you to modify the XMLHttpRequest object (setting additional headers, if need be.)
ajaxSend (Global Event)
This global event is also triggered before the request is run.
success (Local Event)
This event is only called if the request was successful (no errors from the server, no errors with the data).
ajaxSuccess (Global Event)
This event is also only called if the request was successful.
error (Local Event)
This event is only called if an error occurred with the request (you can never have both an error and a success callback with a request).
ajaxError (Global Event)
This global event behaves the same as the local error event.
complete (Local Event)
This event is called regardless of if the request was successful, or not. You will always receive a complete callback, even for synchronous requests.
ajaxComplete (Global Event)
This event behaves the same as the complete event and will be triggered every time an Ajax request finishes.
ajaxStop (Global Event)
This global event is triggered if there are no more Ajax requests being processed.
jQuery.ajaxSetup( options ) : 设置全局 AJAX 默认选项。
设置 AJAX 请求默认地址为 "/xmlhttp/"，禁止触发全局 AJAX 事件，用 POST 代替默认 GET 方法。其后的 AJAX 请求不再设置任何选项参数。
jQuery 代码:

代码如下:

$.ajaxSetup({
url: "/xmlhttp/",
global: false,
type: "POST"
});
$.ajax({ data: myData });

如果指定为 html 类型，任何内嵌的 JavaScript 都会在 HTML 作为一个字符串返回之前执行。类似地，指定 script 类型的话，也会先执行服务器端生成 JavaScript，然后再把脚本作为一个文本数据返回。
JSON 数据是一种能很方便通过 JavaScript 解析的结构化数据。如果获取的数据文件存放在远程服务器上（域名不同，也就是跨域获取数据），则需要使用 jsonp 类型。使用这种类型的话，会创建一个查询字符串参数 callback=? ，这个参数会加在请求的 URL 后面。服务器端应当在 JSON 数据前加上回调函数名，以便完成一个有效的 JSONP 请求。如果要指定回调函数的参数名来取代默认的 callback，可以通过设置 $.ajax() 的 jsonp 参数。

    

[2]灵活应用js调试技巧解决样式问题的步骤分享

    来源: 互联网  发布时间: 2013-11-24

由于种种原因，例如：代码逻辑复杂、时间久了遗忘处理细节、或者根本就是接手修改别人遗留的bug，在这种情况下，debug就会变成一件头疼的事情。

在此分享一些JS调试方面的技巧，针对各种疑难杂症，往往能起到较好的效果。

Step 1：检查服务器直接render出来的内容

　　　　使用查看源文件的方式，这一步首先明确，页面HTML片段是否在服务器端就已经不正常了。

Step 2：比较实际的HTML内容和服务器render出来的原始内容之间的差异

　　　　可以使用一些前端工具（例如：IE下的开发人员工具、Firebug、Chrome的开发人员工具等），实时查看当前HTML片段内容

Step 3：在合适的位置增加debugger

　　　　例如：先找出大概可能出问题的js代码，在合适的地方加debugger，或者是使用工具增加类似于“在属性被修改时中断”的断点，例如实际的HTML比原始内容多出了一个width属性

Step 4：运行你的页面，进入中断，并检查js调用堆栈（关键的一步）

　　　　推荐使用IE支持的Visual Studio调试器（需要先设置IE：取消“禁用脚本调试”），这时基本就能确定是哪个js方法修改了样式

    

[3]3款实用的在线JS代码工具(国外)

    来源: 互联网  发布时间: 2013-11-24

1. 压缩工具

用于在线压缩你的JS代码，它有一个选项“Include latest jquery.min.js”，这对于提升速度非常有用。

推荐理由：缩小代码 = 更小的文件大小 = 更快的网页加载速度

2. 美化工具

用于将压缩后的代码转换回正常状态，使代码再次可读。该工具也可用于混淆的代码。

推荐理由：漂亮的代码 = 易读 = 更快地开发

3. 混淆工具

用于保护（混淆）你的代码，使代码不可读。很显然，一些模仿者可以使用一个工具去反混淆/解压缩，但是你为代码设置的保护越多越好。

推荐理由：混淆代码 = 不可读 = 保护劳动成果