码迷,mamicode.com
首页 > Web开发 > 详细

Ajax的快速入门

时间:2019-05-12 01:51:27      阅读:160      评论:0      收藏:0      [点我收藏+]

标签:request   参数   meta   客户端   header   admin   str   ==   text   

1.什么是ajax

      ajax是技术名词的缩写:

       Asynchronous:异步;

       JavaScript:JavaScript语言;

       And:和、与;

       XML:数据传输格式

      ajax是客户端通过HTTP向服务器发送请求

2.ajax对象的属性、方法

   属性

readyState:  Ajax状态码

 

         3.xhr.getAllResponseHeaders() 获取全部响应头信息

         4.xhr.getResponseHeader(‘key‘) 获取指定头信息

         5.send([content]) :发送Ajax请求content : 如果是get请求时,此参数为null;如果是post请求时,此参数就是要传递的数据

        注意: 所有相关的事件绑定必须在调用send()方法之前进行.

3.案例

     html页面

     

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
    </head>
    <body>
        用户名:<input type="text" value="" id="inp">
        <span></span>
    </body>
    <script>
      var inp=document.getElementById(‘inp‘);
      inp.onblur=function(){
          var xhr=new XMLHttpRequest();
          xhr.onreadystatechange=function(){
              if(xhr.readyState==4){
                 if(xhr.responseText==1){
                      inp.nextElementSibling.innerHTML=‘此用户名不可以用‘;
                      inp.nextElementSibling.style.color=‘red‘;
                 }
                 else{ 
                      inp.nextElementSibling.innerHTML=‘此用户名可以用‘;
                      inp.nextElementSibling.style.color=‘green‘;
                 }

              }
          }
          xhr.open(‘get‘,‘http://127.0.0.1:8000/getone?‘+inp.value);
          xhr.send();
      }
</script>
</html>

  js页面

//引入http模块
var http = require(‘http‘);
//引入fs模块
var fs = require(‘fs‘);
//引入url模块
var url = require(‘url‘);
//创建一个server对象
var server = http.createServer();
//设置8000端口
server.listen(8000, function () {
    console.log(‘启动8000服务器‘, ‘http//127.0.0.1:8000‘)
});
//设置server事件
server.on(‘request‘, function (req, res) {
    //判断路径
    var urls = url.parse(req.url);
    if (urls.pathname == ‘/getone‘) {
        // console.log(urls.query);
        if (urls.query == "admin") {
            res.end(‘1‘);
        }
        else {
            res.end(‘0‘);
        }
    }
    else {
        fs.readFile(‘.‘ + urls.pathname, function (err, data) {
if (!err) { res.end(data); } else { res.end(‘‘); } }); } });

  

 

技术图片

Ajax的快速入门

标签:request   参数   meta   客户端   header   admin   str   ==   text   

原文地址:https://www.cnblogs.com/shineguang/p/10850651.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!