首页
学习
活动
专区
圈层
工具
发布

JQuery 入门学习(三)

这一节涉及到浏览器与服务器的交互,我用到的是php,如果各位看官不会php脚本也没有关系,涉及到的php代码最多10行,重点还是在Jquery上。...甚至我们做一个网站,放上背景音乐,网站中一切链接都由ajax完成(比如点击了一片文章,ajax向服务器请求文章内容,然后用我上次说的Jquery html操作将网页中的一部分进行修改,这样文章就放入了页面而并不刷新页面...首先选择器选择了id=name的文本框,用val()方法获取其值,并赋值给name变量。     看后面,用到了get方法。...但是数字、字符串很好传递,有些对象却并不那么容易传递,比如数组。我们怎么把一个数组对象通过QQ发送给别人?    ...ajax的json方法     Jquery中从服务器加载json数据的方法是:$.getJSON     它的参数与get()方法完全一样,但是服务器返回结果data应该是一个json格式的字符串

9.8K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    jsonp跨域原理简单总结_jsonp的工作原理

    ://example2.com/getinfo.php返回时,可以返回一段JavaScript代码,这段代码会自动执行,可以用来负责调用http://example1.com/index.php页面中的一个...然后以 javascript 语法的方式,生成一个function,function名字就是传递上来的参数 ‘jsoncallback’的值 jsonp1236827957501 ....最后将 json 数据直接以入参的方式,放置到 function 中,这样就生成了一段 js 语法的文档,返回给客户端。...此时,服务器生成 json 数据。然后以 javascript 语法的方式,生成一个function , function 名字就是传递上来的参数 jsonp。...最后将 json 数据直接以入参的方式,放置到 function 中,这样就生成了一段 js 语法的文档,返回给客户端。

    2.8K40

    一个小时学会jQuery

    $("#feeds").load("feeds.html"); //请求 test.php 网页,传送2个参数,忽略返回值。...发送数据,并输出结果(HTML 或 XML,取决于所返回的内容): $.post("test.php", { name: "John", time: "2pm" }, function(data){...这种情况下,$.ajax()不再返回一个XMLHttpRequest对象,并且也不会传递事件处理函数,比如beforeSend。 5.3、发送数据到服务器 默认情况下,Ajax请求使用GET方法。...$.ajax函数返回他创建的XMLHttpRequest对象。通常jQuery只在内部处理并创建这个对象,但用户也可以通过xhr选项来传递一个自己创建的xhr对象。...在1.4中,JSON就会生成一个JavaScript对象,而script则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。

    22.4K71

    前端架构师之01_JQuery

    ) 为所有匹配的元素设置一个属性值 attr(name, function) 将函数的返回值作为所有匹配的元素的name属性值 prop(name) 取得第一个匹配元素的属性值,否则返回undefined...prop(properties) 将一个键值对形式的对象设置为所有匹配元素的属性 prop(name, value) 为所有匹配的元素设置一个属性值 prop(name, function) 将函数的返回值作为所有匹配的元素的...data表示传递的参数。 参数fn表示请求成功时,执行的回调函数。 参数type用于设置服务器返回的数据类型,如XML、JSON、HTML、TEXT等。...请求的地址是同级目录下的index.php,在Ajax请求成功后,接收index.php返回的JSON格式的数据并在控制台进行输出。...); 上述代码表示处理当前Ajax请求的地址是同级目录下的index.php,在Ajax请求成功后,接收index.php返回的JSON格式的数据并在控制台进行输出。

    3.1K00

    初学者必看Ajax的总结

    json 转换为对象格式用JSON.parse() 返回值一般为 json 字符串,可以用JSON.parse(xhr.responseText)转化为 JSON 对象 从服务器传回的数据是 json...在客户端声明回调函数之后,客户端通过 script 标签向服务器跨域请求数据,然后服务端返回相应的数据并动态执行回调函数 用 XMLHttpRequest 时,我们得到一个字符串;要用JSON.parse...把字符串转化成对象,使用 jsonp 时,script 标志会解析并执行返回的代码,等我们处理数据时,已经是一个 JavaScript 对象了 注意浏览器的缓存问题 在末尾增加一个随机数可避免频繁请求同一个链接出现的缓存问题...,jquery 将自动替换后一个?.../调用本次 Ajax 请求时传递的 options 参数} success Function 请求成功后调用的回调函数,有两个参数(1)由服务器返回,并根据 dataTyppe 参数进行处理后的数据(2

    3.6K40

    JqueryForm的使用方式

    元素的值可能被指定为一个jQuery选择器字符串,一个jQuery对象,或者一个DOM元素。 默认值:null。 url 指定提交表单数据的URL。 覆盖表单默认值。...这个被直接地反映到jQuery.httpData方法中去。下面的值被支持: ‘xml’:如果dataType == ‘xml’,将把服务器响应作为XML来对待。...‘json’:如果dataType == ‘json’, 服务器响应将被求值,并传递到”success”回调方法,如果它被指定的话。...如果提供”success”回调函数,当从服务器返回响应后它被调用。然后由dataType选项值决定传回responseText还是responseXML的值。...从0.91版起,该方法将总是以数组的形式返回数据。如果元素值被判定可能无效,则数组为空,否则它将包含一个或多于一个的元素值。 可链接(Chainable):不能,该方法返回数组。

    3.1K20

    原生JS与jQuery对AJAX的实现

    ,本文讲从原生JS和jQuery方面介绍AJAX的实现,跨域问题暂且不表。...,200是成功,404是未找到页面 responseText是返回的数据,为字符串格式 三、jQuery实现AJAX 1.GET 使用get()方法时,采用GET方式向服务器请求数据,并通过方法中回调函数的参数返回请求的数据...使用serialize()方法可以将表单中有name属性的元素值进行序列化,生成标准URL编码文本字符串,直接可用于ajax请求,它的调用格式如下: $(selector).serialize()...3.ajax 使用ajax()方法是最底层、功能最强大的请求服务器数据的方法,它不仅可以获取服务器返回的数据,还能向服务器发送请求并传递数值,它的调用格式如下: $.ajax([settings])...五、总结 一般来说,处理AJAX,用jQuery的get和post的就够用,如果是JSON数据的话用getJSON,注意缓存问题,特殊的应用再考虑用ajax(),另外,AJAX还有一个很严重的问题是跨域

    4K20

    ajax 使用 与 缓存问题

    使用get方式需要注意:   1 对于get请求(或凡涉及到url传递参数的),被传递的参数都要先经encodeURIComponent方法处理.例:var url = "update.php?...,检查你的方式是否为get,对于get请求(或凡涉及到url传递参数的),被传递的参数都要先经 encodeURIComponent方法处理.如果没有用encodeURIComponent处理的话,也会产生乱码...如果为数组,jQuery 将自动为不同值对应同一个名称。如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2'。...如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息返回 responseXML 或 responseText,并作为回调函数参数传递,可用值: "xml": 返回 XML 文档,可用 jQuery..."html": 返回纯文本 HTML 信息;包含 script 元素。 "script": 返回纯文本 JavaScript 代码。不会自动缓存结果。 "json": 返回 JSON 数据 。

    3.3K20

    使用Jsonp解决跨域数据访问问题

    其实现主要使用的是XMLHttpRequest函数,这个函数允许客户端的Javascript 发送到服务器端的HTTP请求并获得返回数据。...例如一个ticker对象     var ticker = {symbol:'IBM',price:100} 而JSON串就是    {symbol:'IBM',price:100} 这样我们就可以在函数的参数中传递...我们通常所说的JSONP服务(远程JSON服务),实际上就是一种扩展的支持在用户定义函数中包含返回数据的能力。这种方法依赖于必须接受一个回调函数的名字作为参数。...然后执行这个函数,处理JSON数据,并显示在客户页面上。 JQuery的JSONP支持 从JQery 1.2以后,就开始支持JSONP的调用。...上例中我们在动态插入到页面的代码中使用了静态的json数据,虽然完成了依次JSONP返回,但仍不是JSONP服务,因为不支持在URL中定义回调函数名称。

    1.5K20

    Web前端-Ajax基础技术(下)

    = 4) return var res = JSON.parse(this.responseText); // res 服务器返回的数据 var data = res.data; for(var...console.log(res); } }) $.ajax({ url: 'json.php', type: 'get', dataType: 'json', success: function...) 为以后要用到的ajax请求设置默认的值 jQuery.ajaxTransport() 创建一个对象 jQuery.get() 使用一个http get请求从服务器加载数据 jQuery.getJSON...() jQuery.getScript() GET请求从服务器加载并执行一个 JavaScript 文件 jQuery.post() 请求从服务器加载数据 跨域: 同源,域名,协议,端口,完全相同,同源的相互通过...原理是在客户端借助script标签请求服务端的一个动态网页,服务端的这个动态网页返回一段带有函数调用的javascript全局函数调用的脚本,将原本需要返回给客户端的数据传递进去。

    2.9K30
    领券