ajax与普通js有什么区别，javascript和AJAX的区别

JavaScript018

ajax与普通js有什么区别，javascript和AJAX的区别,第1张

javascript是一种在客户端执行的脚本语言。ajax是基于javascript的一种技术，它主要用途是提供异步刷新（只刷新页面的一部分，而不是整个页面都刷新）。一个是语言,一个是技术,两者有本质区别.

ajax返回form表单 html js能执行的，可以利用纯js来提交：

1、ajax返回如下form，用创建来模仿：

function post(url, params) {

var tempForm = document.createElement("form")

tempForm.action = url

tempForm.method = "post"

tempForm.style.display = "none"

for (var x in params) {

var opt = document.createElement("textarea")

opt.name = x

opt.value = params[x]

// alert(opt.name)

tempForm.appendChild(opt)

}

document.body.appendChild(tempForm)

tempForm.submit()

return tempForm

}

2、定义提交form的参数：

function postParamAndOpenWindow(urlAndQuery){

// 分割url和请求参数

var pos = urlAndQuery.indexOf('?')

var url = urlAndQuery.substring(0, pos)

var query = urlAndQuery.substring(pos + 1)

// 动态建立Form中的数据

var tempForm = document.getElementById('tmpForm')

tempForm.action = url

tempForm.method = "post"

var pairs = query.split("&")

for(var i = 0i <pairs.lengthi++) {

var pos = pairs[i].indexOf('=')

if (pos == -1) continue

var argname = pairs[i].substring(0, pos)

var value = pairs[i].substring(pos + 1)

var opt = document.createElement("textarea")

opt.name = argname

opt.value = value

tempForm.appendChild(opt)

}

tempForm.submitBtn.click()

return tempForm

}

3、在页面调用的方法：

<a href="#" onclick="postParamAndOpenWindow("http://www.xxx.com/login?username=xxx&password=yyy')">

   ajax({

        url: "",              //请求地址

        type: "POST",                       //请求方式

        data: { name: "super", age: 20 },        //请求参数

        dataType: "json",

        success: function (response, xml) {

            // 此处放成功后执行的代码

        },

        fail: function (status) {

            // 此处放失败后执行的代码

        }

    })

    function ajax(options) {

        options = options || {}

        options.type = (options.type || "GET").toUpperCase()

        options.dataType = options.dataType || "json"

        var params = formatParams(options.data)

        if (window.XMLHttpRequest) {

            var xhr = new XMLHttpRequest()

        } else {

            var xhr = new ActiveXObject('Microsoft.XMLHTTP')

        }

        xhr.onreadystatechange = function () {

            if (xhr.readyState == 4) {

                var status = xhr.status

                if (status >= 200 && status < 300) {

                    options.success && options.success(xhr.responseText, xhr.responseXML)

                } else {

                    options.fail && options.fail(status)

                }

            }

        }

        if (options.type == "GET") {

            xhr.open("GET", options.url + "?" + params, true)

            xhr.send(null)

        } else if (options.type == "POST") {

            xhr.open("POST", options.url, true)

            xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")

            xhr.send(params)

        }

    }

    function formatParams(data) {

        var arr = []

        for (var name in data) {

            arr.push(encodeURIComponent(name) + "=" + encodeURIComponent(data[name]))

        }

        arr.push(("v=" + Math.random()).replace("."))

        return arr.join("&")

    }