Ajax与jQuery

目录


Ajax是一种异步无刷新的技术

Ajax的优点:

  1. 可以无需刷新页面与服务器端进行通信
  2. 允许根据用户事件来更新部分页面内容

Ajax的缺点:

  1. 没有浏览历史,不能回退
  2. 存在跨域问题(同源)
  3. SEO(搜索引擎优化)不友好

jquery 调用 ajax 方法:

$.ajax

格式:

$.ajax({ [参数] });

格式: $.ajax(});参数:

type: 请求方式GET/POST

url: 请求地址url

async: 是否异步,默认是true表示异步

data: 发送到服务器的数据

dataType: 预期服务器返回的数据类型

contentType: 设置请求头

success: 请求成功时调用此函数

error: 请求失败时调用此函数

$.get

这是一个简单的GET 请求功能以取代复杂 $ajax

请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。

语法:

// 1.请求json文件,忽略返回值
$.get( 'js/cuisine_area.json' );
// 2.请求json文件,传递参数,忽略返回值

$.get( 'js/cuisine_area.json',{ name:"tom" ,age:100} );
// 3.请求json文件,拿到返回值,请求成功后可拿到返回值

$.get( 'js/cuisine_area.json',function( data ) {

console.log(data)

});
// 4.请求json文件,传递参数,拿到返回值

$.get('js/cuisine_area.json' , { name:"tom",age:100},function(data){

console.log(data) ;
});

$.post

$.getJSON

表示请求返回的数据类型是]SON格式的ajax请求

$.getJSON('js/cuisine_area.json' , { name:"tom",age:100},function(data){

console.log(data) ; //要求返回的数据类型时JSON格式
});

相关推荐
独泪了无痕5 小时前
使用Fetch API 探索前后端数据交互
前端·http·交互设计
css趣多多5 小时前
别名路径的知识点
前端
靓仔建7 小时前
Vue3导入组件出错does not provide an export named ‘user_setting‘ (at index.vue:180:10)
开发语言·前端·typescript
EnoYao7 小时前
我写了一个团队体检报告 Skill,把摸鱼的同事扒出来了😅
前端·javascript
梁正雄8 小时前
Python前端-2-css练习
前端·css·python
清汤饺子8 小时前
用 Cursor 半年了,效率还是没提升?是因为你没用对这 7 个功能
前端·后端·cursor
蓝莓味的口香糖8 小时前
【vue3】组件的批量全局注册
前端·javascript·vue.js
wefly20178 小时前
开发者效率神器!jsontop.cn一站式工具集,覆盖开发全流程高频需求
前端·后端·python·django·flask·前端开发工具·后端开发工具
独泪了无痕8 小时前
自动导入 AutoImport:告别手动引入依赖,优化Vue3开发体验
前端·vue.js·typescript
GDAL9 小时前
MANIFEST.in简介
linux·服务器·前端·python