jquery

js工具库

下载        https://jquery.com/download/     生产版本，压缩过的，体积小  min.js      开发版本，未压缩，体积大，可以看源码            https://www.jquery123.com/

引入jquery     在head中使用script 结合 src

console.log($);          打印函数则引入成功

文档加载完毕事件     $(function(){  "加载完毕" })

三部曲

1.获取元素

$("选择器")     返回的是jquery对象       jquery转js   get(0)   js转jquery  $(js对象)    $(this)    将js转jquery       遍历  each  function(index,item){  $(item) }

2.绑定事件

js所有事件    事件名不带on

$(this).click(function(e){  })

$(this).on("事件名", 函数名)

$(this).off("事件名", 函数名)    不带函数名 则关闭所有事件

$(this).one("事件名", 函数名)   只执行一次 

3.修改、获取

内容 text()  html() 识别标签    如果没有实参就是获取，有实参就是设置

属性

普通属性   attr("属性名")  获取   attr("属性名", "属性值")  设置

类名属性   hasClass()    addClass()   removeClass()   toggleClass()

样式 css 

css("属性名")      获取

css("属性名", "属性值")       获取设置

css({ "属性名", "属性值", "属性名","属性值"  })

动画     显示与隐藏   show hide toggle        自定义    animate({  }, time, function(){  })

其他

相关元素      父  parent()    子  children()     上一个   prev()     下一个  next()      同级别其他的

siblings()

创建与删除

A.appendTo(B)     返回A      A是创建内容

A.append(B)     返回A    B是创建内容

目标元素.remove()   移除

目标元素.empty()     删除目标元素所有子元素

与服务器交互

form表单    将用户数据提交到服务器     缺点      必须刷新整个页面

ajax异步刷新     阿贾克斯       推荐使用    局部刷新页面

$.ajax({  })    url  服务器地址     method  get post    data  参数    sucess   成功回调

跨域

错误提示     No 'Access-Control-Allow-Origin' header

原理       浏览器同源     协议  ip  端口   必须一致     否则   不允许解析数据

解决方案   jquery    使用jsonp