之前我们学习了一些有关jq函数的知识,现在我们看看jq与ajax方面的一些东西:

1.ajax(Asynchronous JavaScript and XML 异步的JavaScript与xml):
    在不重载整个网页的情况下,ajax通过发送请求获取后台数据,显示在页面上。注意ajax并不是一种新的编程语言,而是使用现有标准的新方法。

2.jq与ajax:
    jq提供多个与ajax有关的方法。通过jQuery AJAX方法,您能够使用HTTP Get和HTTP Post从远程服务器上
请求文本、HTML、XML或JSON,可以把这些外部数据直接载入网页的被选元素中。
    如果没有jq,ajax编程并不容易。因为不同的浏览器,ajax的实现方式不一样,这通常意味着我们需要编写
额外的代码对浏览器进行测试。jq已经解决了这个问题,我们只需要一行代码即可进行ajax请求

3.load()方法:
    $(selector).load(URL,data,callback);简单而强大的ajax方法,从服务器加载数据,并把返回的数据放入被选元素中
    URL:        必选,请求URL
    data:        可选,请求参数对象
    callback:    可选,回调函数

    //把文件"demo_test.txt"的内容加载到指定的<div>元素中
$("#div1").load("demo.txt");
//把文件"demo_test.txt"中id="p1"的元素的内容,加载到指定的<div>元素中
$("#div1").load("demo.txt #p1");
 

可选的callback回调函数可以设置三个参数:
        responseTxt - 包含调用成功时的结果内容
        statusTXT   - 包含调用的状态
        xhr         - 包含 XMLHttpRequest 对象

    $("button").click(function(){
$("#div1").load("demo.txt",function(responseTxt,statusTXT,xhr){
if("success"==statusTXT){
alert("内容加载成功");
}else if("error"==statusTXT){
alert("Error: "+xhr.status+": "+xhr.statusText);
}
});
});

4.GET与POST:
    $.get(URL,callback):
    $.post(URL,data,callback):

    //$.get()方法从服务器上的一个文件中取回数据
$("button").click(function(){
$.get("demo.asp",function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
}
); //ASP文件("demo.asp")类似这样:
<%
response.write("This is some text from an external ASP file.")
%>
    //使用$.post()连同请求一起发送数据
$("button").click(function(){
$.post("demo.asp",
{
name:"Donald Duck",
city:"Duckburg"
},
function(data,status){
alert("Data: " + data + "\nStatus: " + status);
}
);
}); //ASP文件("demo.asp")类似这样:
<%
dim fname,city
fname=Request.Form("name")
city=Request.Form("city")
Response.Write("Dear " & fname & ". ")
Response.Write("Hope you live well in " & city & ".")
%>

参考链接(get与post的区别):
    https://www.cnblogs.com/logsharing/p/8448446.html

5.noConflict():

我们使用$作为jQuery的简写,当其他js框架也使用“$”作为简写时,如何才能避免冲突呢?使用noConflict()方法。noConflict()方法会释放$标识符的控制,这样其他脚本就可以使用它了。

    //通过全名替代简写的方式来使用jQuery
$.noConflict();
jQuery(document).ready(function(){
jQuery("button").click(function(){
jQuery("p").text("jQuery 仍在运行!");
});
}); //noConflict()可返回对jQuery的引用,可以把它存入变量,以供稍后使用
var jq = $.noConflict();
jq(document).ready(function(){
jq("button").click(function(){
jq("p").text("jQuery 仍在运行!");
});
}); //把$符号作为变量传递给ready(),在函数内使用$符号,而在函数外,使用 "jQuery"
$.noConflict();
jQuery(document).ready(function($){
$("button").click(function(){
$("p").text("jQuery 仍在运行!");
});
});

jq04--jq与ajax的更多相关文章

  1. 关于jQ的Ajax操作

    jQ的Ajax操作 什么是AJAX AJAX = 异步的javascript和XML(Asynchronous Javascript and XML) 它不是一门编程语言,而是利用JavaScript ...

  2. jq的ajax方法

    相较与js异步对象的繁琐,jq的ajax对象结构更加清晰 一:ajax对象简述 ajax(Asynchronous JavaScript and XML),异步的xml和js对象,主要用于在不刷新全局 ...

  3. jq使用ajax请求,返回状态 canceled错误

    在使用jq,ajax请求时出现该错误 原因:button按钮类型为type=submit ,script中又自定用botton按钮点击提交ajax,造成冲突. 解决方法:button按钮类型改为 ty ...

  4. 【jQuery】 JQ和AJAX

    AJAX AJAX全称异步 JavaScript 和 XML(Asynchronous JavaScript and XML),是一种用于网页前端和网站后台进行数据交互的手段.关于AJAX的详细介绍在 ...

  5. jq的ajax交互封装

    jq封装的ajax,然后 在此前和此后都是很多要考虑的  ,何不 想想构思封装下. 下面: 基本上网页都存在各种ajax,使得网页变得更加易于操作. 举个长长的例子吧: <input type= ...

  6. js、jq、ajax之间的关系

    一句话:js是一种客户端脚本语言,jq是在js基础上封装起来的一个开发工具,ajax是基于js的一种技术(异步刷新). javascript是一种在客户端执行的脚本语言,用来给网页添加动态功能,使网页 ...

  7. jq之ajax以及json数据传递

    <html> <head><meta http-equiv="Content-Type" content="text/html; chars ...

  8. AJAX04 JQ的AJAX

    一.jQuery中的Ajax 1.jQuery为我们提供了更强大的Ajax封装 $.ajax({}) 可配置方式发起Ajax请求 $.get() 以GET方式发起Ajax请求 $.post() 以PO ...

  9. jq+jsonp+ajax解决跨域问题

    Jsonp(JSON with Padding)是资料格式 json 的一种“使用模式”,可以让网页从别的网域获取资料. 关于Jsonp更详细的资料请参考http://baike.baidu.com/ ...

  10. angular 和jq 的AJAX的请求区别

    最近项目中使用angular,结果发现后台没法获取参数,所以,稍微研究了一下两者在发送ajax时的区别. 注意angular和jquery的ajax请求是不同的. 在jquery中,官方文档解释con ...

随机推荐

  1. B+树和LSM比较(转)

    出处:https://blog.csdn.net/u013928917/article/details/75912045 B+树和LSM比较 在关系型数据库mysql中普遍使用B+树作为索引,在实际中 ...

  2. vue.js实战(文摘)

    ---------------第1篇 基础篇 第1章 初始vue.js 第2章 数据绑定和第一个vue应用 第3章 计算属性 第4章 v-bind及class与style绑定 第5章 内置命令 第6章 ...

  3. 谈谈thinkphp5.1中容器(Container)和门面(Facade)的实现

    tp5.1中引入了容器(Container)和门面(Facade)这两个新的类 官方文档已经给出了定义: 容器(Container)实现类的统一管理,确保对象实例的唯一性. 门面(Facade)为容器 ...

  4. AngularJs ng-repeat用法二$parent.$index

    我们在开发时时常会出现repeat嵌套使用的情况,此时会想获取父级repeat数组的下标可使用$parent.$index

  5. 笔记:认识 head 标签 待 更新中……

    文档的头部描述了文档的各种属性和信息,包括文档的标题等.绝大多数文档头部包含的数据都不会真正作为内容显示给读者. 下面这些标签可用在 head 部分: <head> <title&g ...

  6. svn本地如何切换账号

    SVN如何切换账号   在使用svn更新或提交数据时需要输入用户名和密码,在输入框中可以选择是否记录,以便下次操作无需再次输入用户名和密码: 要切换其他用户名时,需要删除已记录用户的数据,在电脑桌面上 ...

  7. POJ3189 Steady Cow Assignment

    Steady Cow Assignment Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 6817   Accepted:  ...

  8. 《javascript高级程序设计》 touch事件的一个小错误

    最近一段时候都在拜读尼古拉斯大神的<javascript高级程序设计>,真的是一本好书,通俗易懂,条理比<javascript权威指南>好理解一些,当然<javascri ...

  9. hdu 1.3.2 Moving Tables

    这道题比较简单,就是用数组存取其路径.如101和102是对门,其过道号可以记为51.  1和2之间的为1. 今早突然收到操作系统停课的通知,哈哈 回来就做一下水题,开心 #include<cst ...

  10. Spring Boot 2 启动时加载properties文件

    每个项目从开发到测试再到上线所需要的各种环境是不同的,这就需要维护相应的配置文件,比如properties或yml文件.有了配置文件后就要考虑如何与应用进行集成. 对于云环境来讲,项目发布需要打成镜像 ...