jquery get 方法 html 预期(jquery ready方法)

大家好,今天小编来为大家解答以下的问题，关于jquery get 方法 html 预期，jquery ready方法这个很多人还不知道，现在让我们一起来看看吧！

即将发布的jQuery3有哪些新特性_jquery

jQuery的横空出世，至今已有十个年头了，而它的长盛不衰显然不是没有理由的。jQuery是继prototype之后又一个优秀的Javascript库。它是轻量级的js库，它兼容CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+），jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML（标准通用标记语言下的一个应用）、events、实现动画效果，并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。

在未来的几周内，jQuery就将抵达一个重要的里程碑——正式发布 3.0版本。jQuery 3修复了大量的 bug，增加了新的方法，同时移除了一些接口，并修改了少量接口的行为。在这篇文章中，我将为大家重点讲解 jQuery 3所引入的那些最重要的变化。

新增特性

我们先来讨论 jQuery 3中最重要的几个新增特性。

for...of循环

在 jQuery 3中，我们可以用 for...of循环语句来迭代一个 jQuery集合中的所有 DOM元素。这种新的迭代方法是 ECMAScript 2015（即 ES6）规范中的一部分。这个方法可以对“可迭代对象”（比如 Array、Map、Set等）进行循环。

当使用这种新的迭代方法时，你在循环体内每次拿到的值并不是一个 jQuery对象，而是一个 DOM元素（译注：这一点跟.each()方法类似）。当你在对一个 jQuery集合进行操作时，这个新的迭代方法可以少许改善你的代码。

为了搞清楚这种迭代方法到底是怎么工作的，我们来假设一个场景——你需要给页面中的每个 input元素分配一个 ID。在 jQuery 3之前，你可能会这样写：

代码如下:var$inputs=$('input');for(var i= 0; i$inputs[i].id='input-'+ i;

}

而在 jQuery 3中，你就可以这样写了：

代码如下:var$inputs=$('input');var i= 0;

for(var input of$inputs){

input.id='input-'+ i++;

}

（译注：其实 jQuery自己是有个.each()方法的，可读性也不赖。）

$.get()和$.post()函数的新签名

jQuery 3为$.get()和$.post()这两个工具函数增加了新签名，从而使得它们和$.ajax()的接口风格保持一致。新签名是这样的：

代码如下:$.get([settings])

$.post([settings])

settings是一个对象，它包含多个属性。它的格式和你以前传给$.ajax()的参数格式是一样的。如果你想更清楚地了解这个参数对象，请参考$.ajax()页面中的相关描述。

$.get()和$.post()的参数对象与传给$.ajax()的参数相比，唯一的区别就是前者的 method属性总是会被忽略。原因其实也很简单，$.get()和$.post()本身就已经预设了发起 Ajax请求的 HTTP方法了（显然$.get()就是 GET，而$.post()就是 POST）。也就是说，正常人类应该是不会想用$.get()方法来发送一个 POST请求的。

假设有以下一段代码：

代码如下:$.get({

url:'',

method:'POST'// This property is ignored

//这个属性将被忽略});

不管我们把 method属性写成什么，这个请求总是会以 GET的方式发出去的。

采用 requestAnimationFrame()来实现动画

所有现代浏览器（包括 IE10及以上）都是支持 requestAnimationFrame的。jQuery 3将会在内部采用这个 API来实现动画，以便达到更流畅、更省资源的动画效果。

unwrap()方法

jQuery 3为 unwrap()方法增加了一个可选的 selector参数。这个方法的新签名是这样的：

代码如下:unwrap([selector])

有了这个特性，你就可以给这个方法传入一个包含选择符表达式的字符串，用它来在父元素内进行匹配。如果存在匹配的子元素，则这个子元素的父层将被解除；如果没有匹配，则不进行操作。

有变更的特性

jQuery 3还修改了一些特性的行为。

:visible和:hidden

jQuery 3将会修改:visible和:hidden过滤器的含义。只要元素具有任何布局盒，哪怕宽高为零，也会被认为是:visible。举个例子，br元素和不包含内容的行内元素现在都会被:visible这个过滤器选中。

因此，如果你的页面中包含如下的结构：

代码如下:

然后运行以下语句：

代码如下:console.log($('body:visible').length);

在 jQuery 1.x和 2.x中，你得到的结果会是 0；但在 jQuery 3中，你会得到 2。

data()方法

另一个重要的变化是跟 data()方法有关的。现在它的行为已经变得跟 Dataset API规范一致了。jQuery 3将会把所有属性键名转换成驼峰形式。我们来详细看一下，以如下元素为例：

代码如下:

当我们在用 jQuery 3以前的版本时，如果运行如下代码：

代码如下:var$elem=$('#container');

$elem.data({'my-property':'hello'});console.log($elem.data());

将会在控制台得到如下结果：

代码如下:{my-property:"hello"}

而在 jQuery 3中，我们将会得到如下结果：

代码如下:{myProperty:"hello"}

请注意，在 jQuery 3中，属性名已经变成了驼峰形式，横杠已经被去除了；而在以前的版本中，属性名会保持全小写，并原样保留横杠。

Deferred对象

jQuery 3还改变了 Deferred对象的行为。Deferred对象可以说是 Promise对象的前身之一，它实现了对 Promise/A+协议的兼容。这个对象以及它的历史都相当有意思。如果想要深入了解，你可以去阅读 jQuery官方文档，也可以去看我写的书《jQuery实战（第三版）》——这本书也涵盖了 jQuery 3。

在 jQuery 1.x和 2.x中，传给 Deferred的回调函数内如果出现未捕获的异常，会立即中断程序的执行（译注：即静默失败，其实 jQuery绝大多数回调函数的行为都是这样的）。而原生的 Promise对象并非如此，它会抛出异常，并不断向上冒泡，直至到达 window.onerror（通常冒泡的终点是这里）。如果你没有定义一个函数来处理这个错误事件的话（通常我们都不会这么做），那这个异常的信息将会被显示出来，此时程序的执行才会停止。

jQuery 3将会遵循原生 Promise对象的模式。因此，回调内产生的异常将会导致失败状态（rejection），并触发失败回调。一旦失败回调执行完毕，整个进程就将继续推进，后续的成功回调将被执行。

为了让你更好地理解这个差异，让我们来看一个小例子。比如我们有如下代码：

代码如下:var deferred=$.Deferred();

deferred

.then(function(){ throw new Error('An error');

})

.then( function(){ console.log('Success 1');

}, function(){ console.log('Failure 1');

}

)

.then( function(){ console.log('Success 2');

}, function(){ console.log('Failure 2');

}

);

deferred.resolve();

在 jQuery 1.x和 2.x中，只有第一个函数（也就是抛出错误的那个函数）会被执行到。此外，由于我们没有为 window.onerror定义任何事件处理函数，控制台将会输出“Uncaught Error: An error”，而且程序的执行将中止。

而在 jQuery 3中，整个行为是完全不同的。你将在控制台中看到“Failure 1”和“Success 2”两条消息。那个异常将会被第一个失败回调处理，并且，一旦异常得到处理，那么后续的成功回调将被调用。

SVG文档

没有哪一个 jQuery版本（包括 jQuery 3）曾官方宣称支持 SVG文档。不过事实上有很多方法是可以奏效的，此外还有一些方法在以前是不行的（比如操作类名的那些方法），但它们在 jQuery 3中也得到了更新。因此，在 jQuery 3中，你应该可以放心使用诸如 addClass()和 hasClass()这样的方法来操作 SVG文档了。

已废弃、已移除的方法和属性

在增加了上述改进的同时，jQuery也移除、废弃了一些特性。

废弃 bind()、unbind()、delegate()和 undelegate()方法

jQuery在很久以前就引入了 on()方法，它提供了一个统一的接口，用以取代 bind()、delegate()和 live()等方法。与此同时，jQuery还引入了 off()这个方法来取代 unbind()、undelegated()和 die()等方法。从那时起，bind()、delegate()、unbind()和 undelegate()就已经不再推荐使用了，但它们还是一直存在着。

jQuery 3终于开始将这些方法标记为“废弃”了，并计划在未来的某个版本（很可能是 jQuery 4）中将它们彻底移除。因此，请在你的项目中统一使用 on()和 off()方法，这样你就不用担心未来版本的变更了。

移除 load()、unload()和 error()方法

jQuery 3彻底抛弃了 load()、unload()和 error()等已经标记为废弃的方法。这些方法在很早以前（从 jQuery 1.8开始）就已经被标记为废弃了，但一直没有去掉。如果你正在使用的某款插件仍然依赖这些方法，那么升级到 jQuery 3会把你的代码搞挂。因此，在升级过程中请务必留意。

移除 context、support和 selector属性

jQuery 3彻底抛弃了 context、support和 selector等已经标记为废弃的属性。同上，在升级到 jQuery 3时，请留意你正使用的插件。

已修复的 Bug

jQuery 3修复了以往版本中的一些非常重要的 bug。在本节中，我将着重介绍其中两处，因为这两者应该会对你写代码的习惯带来显著影响。

width()和 height()的返回值将不再取整

jQuery 3修复了 width()、height()和其它相关方法的一个 bug。这些方法的返回值将不再舍入取整，因为这种取整行为在某些情况下不便于对元素进行定位。

我们来详细看一看。假设你一个宽度为 100px的容器元素，它包含了三个子元素，宽度均为三分之一（即 33.333333%）：

代码如下:

My name

is

Aurelio De Rosa

在 jQuery 3以前的版本中，如果你尝试通过以下代码来获取子元素的宽度??

代码如下:$('.container div').width();

??那么你得到结果将是 33。原因在于 jQuery会把 33.33333这个值取整。而在 jQuery 3中，这个 bug已经被修复了，因此你将会得到更加精确的结果（即一个浮点数）。

wrapAll()方法

jQuery 3还修复了 wrapAll()方法中的一个 bug，这个 bug出现在把一个函数作为参数传给它的情况下。在 jQuery 3以前的版本中，当一个函数被传给 wrapAll()方法时，它会把 jQuery集合中的每个元素单独包裹起来。换句话说，这种行为和把一个函数传给 wrap()时的行为是完全一样的。

在修复这个问题的同时，还引入了另外一个变更：由于在 jQuery 3中，这个函数只会调用一次了，那就无法把 jQuery集合中每个元素都传给它。因此，这个函数的执行上下文（this）将只能指向当前 jQuery集合中的第一个元素。

如何下载 jQuery 3 beta 1

既然你已经读到了这里，那说明你很可能想试试 jQuery 3的第一个 beta测试版。你可以通过以下两个地址来获取这个版本：

未压缩版：

压缩版：

当然，你还可以通过 npm来下载：

[code]npm install jquery@3.0.0-beta1[/code]

结论

很多人一直在唱衰 jQuery，说它在现代网页开发中已经没有一席之地了。但不管怎样，jQuery的开发仍在继续，客观的统计数据（在排名前一百万名的网站中占有率高达 78.5%）也让这些论调不攻自破。

在本文中，我已经带你了解了一遍 jQuery 3将会带来的一些重大变化。或许你已经察觉到了，这个版本并不太可能搞挂你的既有项目，因为它引入的破坏性变更其实寥寥无几。不过，在升级到 jQuery 3的过程中，你还是有必要牢记一些关键点，比如 Deferred对象的改进等等。同样，在升级某个第三方库时，也有必要检查一下该项目的兼容性情况，以便尽早发现任何非预期行为，避免某些功能失效。

译注

除了本文所提及的变更之外，jQuery 3.0最大的变化就是彻底放弃对 IE8的支持。jQuery团队做出这个决定的原因在于，微软已经在今年年初宣布停止对 IE 8～10的支持。因此，jQuery在 3.0 alpha阶段所发布的 jQuery Compat项目也就没有继续存在的必要了。

不过，由于 IE8仍然是中国大陆最流行的浏览器之一，对国内的开发者来说，在短期（甚至中期）内还不得不停留在 jQuery 1.x版本。

好吧，最后还是说个好消息吧。为帮助用户平滑升级，此次 jQuery同样会为 3.0版本提供迁移插件（jQuery Migrate plugin）。在把 jQuery升级到 3.0之后同时运行这个插件，即可确保基于 jQuery 1.x或 2.x的既有业务代码正常运行；同时，它还将在控制台向你报告既有代码与 jQuery 3不兼容的地方。当你修复了这些不兼容问题之后，就可以安全地移除这个插件了。

jQuery.ajax()的参数

options(可选)ObjectAJAX请求设置。所有选项都是可选的。 asyncBoolean

(默认: true)默认设置下，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为 false。注意，同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行。

beforeSend(XHR)Function

发送请求前可修改 XMLHttpRequest对象的函数，如添加自定义 HTTP头。XMLHttpRequest对象是唯一的参数。这是一个 Ajax事件。如果返回false可以取消本次ajax请求。

function(XMLHttpRequest){ this;//调用本次AJAX请求时传递的options参数}cacheBoolean(默认: true,dataType为script和jsonp时默认为false) jQuery 1.2新功能，设置为 false将不缓存此页面。

complete(XHR, TS)Function

请求完成后回调函数(请求成功或失败之后均调用)。参数： XMLHttpRequest对象和一个描述成功请求类型的字符串。 Ajax事件。

function(XMLHttpRequest, textStatus){ this;//调用本次AJAX请求时传递的options参数}contentTypeString(默认: application/x-www-form-urlencoded)发送信息至服务器时内容编码类型。默认值适合大多数情况。如果你明确地传递了一个content-type给$.ajax()那么他必定会发送给服务器（即使没有数据要发送）

contextObject

这个对象用于设置Ajax相关回调函数的上下文。也就是说，让回调函数内this指向这个对象（如果不设定这个参数，那么this就指向调用本次AJAX请求时传递的options参数）。比如指定一个DOM元素作为context参数，这样就设置了success回调函数的上下文为这个DOM元素。就像这样：

$.ajax({ url: test.html, context: document.body, success: function(){$(this).addClass(done);}});

dataObject,String

发送到服务器的数据。将自动转换为请求字符串格式。GET请求中将附加在 URL后。查看 processData选项说明以禁止此自动转换。必须为 Key/Value格式。如果为数组，jQuery将自动为不同值对应同一个名称。如{foo:[bar1, bar2]}转换为'&foo=bar1&foo=bar2'。

dataFilterFunction

给Ajax返回的原始数据的进行预处理的函数。提供data和type两个参数：data是Ajax返回的原始数据，type是调用jQuery.ajax时提供的dataType参数。函数返回的值将由jQuery进一步处理。

function(data, type){//对Ajax返回的原始数据进行预处理 return data//返回处理后的数据}dataTypeString预期服务器返回的数据类型。如果不指定，jQuery将自动根据 HTTP包 MIME信息来智能判断，比如XML MIME类型就被识别为XML。在1.4中，JSON就会生成一个JavaScript对象，而script则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后，传递给回调函数。可用值:

xml:返回 XML文档，可用 jQuery处理。

html:返回纯文本 HTML信息；包含的script标签会在插入dom时执行。

script:返回纯文本 JavaScript代码。不会自动缓存结果。除非设置了cache参数。'''注意：'''在远程请求时(不在同一个域下)，所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)

json:返回 JSON数据。

jsonp: JSONP格式。使用 JSONP形式调用函数时，如 myurl?callback=? jQuery将自动替换?为正确的函数名，以执行回调函数。

text:返回纯文本字符串

errorFunction

(默认:自动判断(xml或 html))请求失败时调用此函数。有以下三个参数：XMLHttpRequest对象、错误信息、（可选）捕获的异常对象。如果发生了错误，错误信息（第二个参数）除了得到null之外，还可能是timeout, error, notmodified和 parsererror。Ajax事件。

function(XMLHttpRequest, textStatus, errorThrown){//通常 textStatus和 errorThrown之中//只有一个会包含信息 this;//调用本次AJAX请求时传递的options参数}globalBoolean(默认: true)是否触发全局 AJAX事件。设置为 false将不会触发全局 AJAX事件，如 ajaxStart或 ajaxStop可用于控制不同的 Ajax事件。

ifModifiedBoolean

(默认: false)仅在服务器数据改变时获取新数据。使用 HTTP包 Last-Modified头信息判断。在jQuery 1.4中，他也会检查服务器指定的'etag'来确定数据没有被修改过。

jsonpString在一个jsonp请求中重写回调函数的名字。这个值用来替代在callback=?这种GET或POST请求中URL参数里的callback部分，比如{jsonp:'onJsonPLoad'}会导致将onJsonPLoad=?传给服务器。

jsonpCallbackString为jsonp请求指定一个回调函数名。这个值将用来取代jQuery自动生成的随机函数名。这主要用来让jQuery生成度独特的函数名，这样管理请求更容易，也能方便地提供回调函数和错误处理。你也可以在想让浏览器缓存GET请求的时候，指定这个回调函数名。

passwordString

用于响应HTTP访问认证请求的密码

processDataBoolean

(默认: true)默认情况下，通过data选项传递进来的数据，如果是一个对象(技术上讲只要不是字符串)，都会处理转化成一个查询字符串，以配合默认内容类型 application/x-www-form-urlencoded。如果要发送 DOM树信息或其它不希望转换的信息，请设置为 false。

scriptCharsetString

只有当请求时dataType为jsonp或script，并且type是GET才会用于强制修改charset。通常只在本地和远程的内容编码不同时使用。

successFunction

请求成功后的回调函数。参数：由服务器返回，并根据dataType参数进行处理后的数据；描述状态的字符串。 Ajax事件。

function(data, textStatus){// data可能是 xmlDoc, jsonObj, html, text,等等... this;//调用本次AJAX请求时传递的options参数}

traditionalBoolean

如果你想要用传统的方式来序列化数据，那么就设置为true。请参考工具分类下面的jQuery.param方法。

timeoutNumber

设置请求超时时间（毫秒）。此设置将覆盖全局设置。

typeString

(默认: GET)请求方式(POST或 GET)，默认为 GET。注意：其它 HTTP请求方法，如 PUT和 DELETE也可以使用，但仅部分浏览器支持。

urlString

(默认:当前页地址)发送请求的地址。

usernameString

用于响应HTTP访问认证请求的用户名

xhrFunction

需要返回一个XMLHttpRequest对象。默认在IE下是ActiveXObject而其他情况下是XMLHttpRequest。用于重写或者提供一个增强的XMLHttpRequest对象。这个参数在jQuery 1.3以前不可用。描述:加载并执行一个 JS文件。

jQuery代码:$.ajax({ type: GET, url: test.js, dataType: script});

描述:

保存数据到服务器，成功时显示信息。

jQuery代码:$.ajax({ type: POST, url: some.php, data: name=John&location=Boston, success: function(msg){ alert( Data Saved:+ msg);}});

描述:

装入一个 HTML网页最新版本。

jQuery代码:$.ajax({ url: test.html, cache: false, success: function(html){$(#results).append(html);}});

描述:

同步加载数据。发送请求时锁住浏览器。需要锁定用户交互操作时使用同步方式。

jQuery代码: var html=$.ajax({ url: some.php, async: false}).responseText;

描述:

发送 XML数据至服务器。设置 processData选项为 false，防止自动转换数据格式。

jQuery代码:

var xmlDocument= [create xml document];$.ajax({ url: page.php, processData: false, data: xmlDocument, success: handleResponse});

jQuery post实例代码：

$.post(test.php,{name:name,pwd:pwd},function(msg){

alert(msg);

})

test.php里面用$_POST[name]和$_POST[pwd]接收参数.

$.post第一个参数是url，{}这里里面的是参数名称和值之间用:非开，多个值用,分开，最后一个是返回的函数msg就是返回的结果。根据自己的需要返回不用的数据。

$.get和post一样，php接收的话改成$_GET[name]和$_GET[pwd]

解决jQuery getJSON 请求后无响应的问题

使用 jQuery的$.getJSON请求后无响应的问题通常由数据类型处理不当、服务器端错误处理不完善、PHP条件判断错误、跨域问题等引起，可通过针对性排查和调整解决。以下是详细排查和解决方案：

一、数据类型处理不当问题原因：$.getJSON默认期望服务器返回有效的 JSON格式数据，若服务器返回的数据格式错误或未设置正确的 Content-Type响应头，会导致解析失败，回调函数无法执行。解决方法：检查响应头：确保服务器返回的 Content-Type为 application/json。

验证 JSON格式：使用在线工具（如 JSONLint）验证返回数据是否为有效 JSON。

手动解析 JSON：若数据格式不正确，改用$.ajax并手动解析：$.ajax({ url:'fetch.php', dataType:'text',//防止自动解析 data:{ getFiat: fiat, getCoin: coin}, success: function(data){ try{ var jsonData= JSON.parse(data); alert(JSON.stringify(jsonData));//显示数据} catch(e){ console.error("JSON解析错误:", e);}}, error: function(jqXHR, textStatus, errorThrown){ console.error("AJAX请求错误:", textStatus, errorThrown);}});

二、服务器端错误处理不完善问题原因：服务器端代码可能存在未捕获的异常，导致返回错误信息或非预期数据，而客户端未正确处理。解决方法：检查服务器日志：查看是否有 PHP错误或异常记录。

完善错误处理：在服务器端使用 try...catch捕获异常，返回明确的错误信息。

客户端错误处理：在$.getJSON的 fail回调中打印详细错误信息：$.getJSON('fetch.php',{ getFiat: fiat}, function(data){ alert(JSON.stringify(data));}).fail(function(jqXHR, textStatus, errorThrown){ console.error("请求失败:", textStatus, errorThrown); console.error("状态码:", jqXHR.status); console.error("响应内容:", jqXHR.responseText);//打印错误详情});

三、PHP条件判断错误问题原因：PHP代码中的逻辑错误可能导致数据未正确输出。例如：//错误代码：isset($json->Response)!="Error"永远为 trueif(isset($json->Response)!="Error"){ echo$data;} else{ echo"Broken duh..";}解决方法：修正逻辑判断：//正确代码：检查存在且值不为"Error"if(isset($json->Response)&&$json->Response!="Error"){ echo$data;} else{ echo"Broken duh..";}//或根据实际需求判断是否为"Success"if(isset($json->Response)&&$json->Response=="Success"){ echo$data;} else{ echo"Broken duh..";}四、跨域问题问题原因：前端页面与 API接口域名不同时，浏览器会阻止跨域请求。解决方法：CORS配置：在服务器端设置响应头：header("Access-Control-Allow-Origin:*");//允许所有域名（生产环境建议指定域名）header("Content-Type: application/json");

JSONP方案：仅适用于 GET请求，设置 dataType:'jsonp'：$.getJSON('fetch.php?callback=?',{ getFiat: fiat}, function(data){ alert(JSON.stringify(data));});

五、其他注意事项缓存问题：浏览器可能缓存旧数据，添加 cache: false禁用缓存：$.getJSON('fetch.php',{ getFiat: fiat}, function(data){ alert(JSON.stringify(data));},{ cache: false});版本兼容性：确保 jQuery版本与代码兼容（如旧版本可能不支持某些语法）。网络问题：检查网络连接是否正常，或使用开发者工具查看请求是否发出。总结通过以上步骤，可逐步排查$.getJSON无响应问题：

检查数据格式和响应头。验证服务器端错误处理和日志。修正 PHP逻辑错误。处理跨域问题。排查缓存、版本或网络问题。建议结合浏览器开发者工具（如 Network面板）监控请求和响应，快速定位问题根源。

好了，文章到此结束，希望可以帮助到大家。