[JavaWeb] Ajax&JQuery

前言:

　　为减少资源浪费,不用为了从后端拿一些资源而刷新一整个页面,前人在js的基础上整出了个局部动态请求

一.Ajax,JQuery选择器

    #id
    .class
    element
    .class.class      交集
            
    : first
    : last 
    : even
    : odd
    : element       
    :eq(index)
    :gt(no)         greater than     index > no 的元素
    :lt(no)        less than   index < no 的元素
    :not(selector)    不在这个选择器里的元素
    :header        所有的h元素
    :contains(text)    包含指定text的所有元素
    :empty        没有子元素的所有元素
    :hidden        所有被隐藏的子元素

二.BOM

对象BOM
    this:
        在方法中,this指的是所有者的对象
        在单独情况下,this指的是全局对象
        在函数中 this 指的是全局对象
        严格模式下函数中,this 是undifined
        在事件中 this 指的是接收事件的元素
    
    window : 代表浏览器的窗口
        全局的js对象函数和变量都自动成为window对象和成员
        方法:
            window.open()
            window.close()
            window.moveTo()   移动当前窗口
            window.resizeTo()    重新调整当前窗口

    
    screen : 代表对象包含用户屏幕的信息
        

    location : 可用于获取当前url,并重定向
        location.herf
        location.hostname
        location.pathname
        location.protocol
        location.assign
    
    history : 
        back    返回url历史列表里的前一个url
        forward    返回url历史列表里的下一个url
    navigator : 
        navigator.appName
        navigator.cookieEnable  查看用户浏览器是否启动cookie    
        navigator.javaEnabled() 方法返回java是否启用         
        navigator.online    值为浏览器是否在线

    弹出框:三种
        1.alert() 警告框  只能点个确定  一般用来确认信息
        2.confirm() 是一个确定框  能点确定和取消,可以用来判断并调用不同的方法
        3.prompt()  提示框能输入一个文本

    Time事件:
        setTimeout()   两个参数  第一个是执行的方法  第二个是执行之前的毫秒数
        clearTimeout()   停止执行
        上述两个方法用一个变量名来充当返回的变量,然后都是用这个变量进行操作
        setInterval()   两个参数  第一个是执行的方法  第二个是隔多少毫秒进行一次执行
        clearInterval()  停止执行
        上述两个 与Timeout()相同
    cookie : 
        使用 ducument.cookie 获取 创建 删除 cookie
        document.cookie 

三.Ajax,JQuery请求

　　JQuery是Ajax的框架,底层封装了Ajax

　　Ajax请求:

var xhr = new XMLHttpRequest();   // 获取一个XMLHttpRequst实例
xhr.open("method_name","data","async");　　//第一个为请求方法,第二个为数据参数,第三个为是否异步
xhr.setHeader("content-type","application/x-www-form-urlencorded");　　//设置请求头
xhr.send();　　//若请求方法为post 则可在send内添加参数
xhr.onreadystatechange = function(){
　　if(xhr.status==200&&xhr.readyState==4){
　　　　//成功响应之后的业务逻辑代码
　　}
}

　　JQuery封装后的ajax请求:

　　1.$.ajax

　　　　

$.ajax({
    url:　　　　//url地址
    method:　　//请求方法
    data:　　　//发送的数据
    dataType:　　//响应数据的类型
    contentType:　　//类型
    success:function(){}　　//请求成功的回调函数
    error:function(){}　　//请求失败的回调函数
});

　　2.$.get　　$.post

$.get(url,dataType,successfunction)
$.get(url,data,dataType,successfunction)