一、昨日内容回顾

　　　　1.jquery位置信息

　　　　　　width() ..,innetWidth() .outWidth()

　　　　　　offset().top left

　　　　　　scrollTop

　　　　2.事件流 DOM2级　　　　　

　　　　　　（1）捕获阶段 （2）处于目标阶段 （3）冒泡
　　　　　　stopPropagation()
　　　　　　preventDefault()

　　　　3.常见事件　　　　　

//解决双击事件与单击事件冲突
click
dblclick
mouseover
mouseout
mouseenter
mouseleave
表单的实施监听内容输入
js中的oninput
form表单的submit jquery中的事件名
form表单的onsubmit 是js中的事件名
阻止默认事件 event.preventDefault()

　　　　4.常见事件对象属性

　　　　　　　event.target event.currentTarget

　　　　5.事件绑定

　　　　　　　bind()　　　

　　　　6.事件委托　　　　　　

事件代理，后来添加的元素要将事件绑定到页面存在的父辈元素中
$('.father').on('click','li',fn)
on()

　　　　7.设计模式，架构模式

　　　　　　　　mvc mtv mvvm

　　　　8.express的简单介绍

　　　　　　　　https://www.cnblogs.com/mq0036/p/5243312.html

　　　　9.nodejs服务器语言

二、今日内容总结

　　　　http://www.cnblogs.com/majj/p/9134922.html

　　　　1.jquery XmlHttpRequest

　　　　　　

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

    <button id="btn">请求</button>

    <script type="text/javascript" src="../jquery.js"></script>

    <script>

        //创建XMLHttpRequest对象

        var xhr = new XMLHttpRequest();

        console.log(xhr.readyState);

        //2.状态机 检测状态 0 1 2 3 4

        xhr.onreadystatechange=function(){

            console.log(xhr.readyState);

            console.log(xhr.status);

            if(xhr.readyState==4){

                console.log('请求成功！');

                var content = xhr.responseText;

                $('body').html(content);

            }

        }

        $('#btn').click(function(){

            xhr.open('get','http://localhost:8800/',true);

            // xhr.open('get','http://localhost:8800/course',true);

            xhr.send();

        });

    </script>

</body>

</html>

实例

　　　　2.jquery $.ajax({ })

三、预习和扩展

　　　1. DOM0和DOM2的简单区别，同样的操作DOM0会产生覆盖现象，DOM2不会。　　　

<!DOCTYPE html>

<html>

<head>

    <title></title>

</head>

<body>

    <button id="btn">点击</button>

    <script type="text/javascript">

        oBtn = document.getElementById('btn');

        oBtn.onclick=function(){

            console.log('I m a DOM0 First!');

        }

        // 这个会覆盖第一个

                oBtn.onclick=function(){

            console.log('I m a DOM0 Second!');

        }

        oBtn.addEventListener('click',function(){

            console.log('I m a DOM2 First!');

        })

        oBtn.addEventListener('click',function(){

            console.log('I m a DOM2 Second!');

        })

    </script>

</body>

</html>

HTML

　　　2. HTTP中application/x-www-form-urlencoded字符说明

　　　　https://blog.csdn.net/qq_28702545/article/details/51719199

　　　　　

python全栈开发day50-jquery之ajax、XmlHttpRquest的更多相关文章

  1. python 全栈开发，Day99(作业讲解,DRF版本,DRF分页,DRF序列化进阶)

    昨日内容回顾 1. 为什么要做前后端分离? - 前后端交给不同的人来编写,职责划分明确. - API (IOS,安卓,PC,微信小程序...) - vue.js等框架编写前端时,会比之前写jQuery ...

  2. python全栈开发目录

    python全栈开发目录 Linux系列 python基础 前端~HTML~CSS~JavaScript~JQuery~Vue web框架们~Django~Flask~Tornado 数据库们~MyS ...

  3. Python全栈开发【面向对象进阶】

    Python全栈开发[面向对象进阶] 本节内容: isinstance(obj,cls)和issubclass(sub,super) 反射 __setattr__,__delattr__,__geta ...

  4. Python全栈开发【面向对象】

    Python全栈开发[面向对象] 本节内容: 三大编程范式 面向对象设计与面向对象编程 类和对象 静态属性.类方法.静态方法 类组合 继承 多态 封装 三大编程范式 三大编程范式: 1.面向过程编程 ...

  5. Python全栈开发【模块】

    Python全栈开发[模块] 本节内容: 模块介绍 time random os sys json & picle shelve XML hashlib ConfigParser loggin ...

  6. Python全栈开发【基础四】

    Python全栈开发[基础四] 本节内容: 匿名函数(lambda) 函数式编程(map,filter,reduce) 文件处理 迭代器 三元表达式 列表解析与生成器表达式 生成器 匿名函数 lamb ...

  7. Python全栈开发【基础三】

    Python全栈开发[基础三]  本节内容: 函数(全局与局部变量) 递归 内置函数 函数 一.定义和使用 函数最重要的是减少代码的重用性和增强代码可读性 def 函数名(参数): ... 函数体 . ...

  8. Python全栈开发【基础二】

    Python全栈开发[基础二] 本节内容: Python 运算符(算术运算.比较运算.赋值运算.逻辑运算.成员运算) 基本数据类型(数字.布尔值.字符串.列表.元组.字典) 其他(编码,range,f ...

  9. Python全栈开发【基础一】

    Python全栈开发[第一篇] 本节内容: Python 的种类 Python 的环境 Python 入门(解释器.编码.变量.input输入.if流程控制与缩进.while循环) if流程控制与wh ...

  10. python 全栈开发之路 day1

    python 全栈开发之路 day1   本节内容 计算机发展介绍 计算机硬件组成 计算机基本原理 计算机 计算机(computer)俗称电脑,是一种用于高速计算的电子计算机器,可以进行数值计算,又可 ...

随机推荐

  1. Winform程序双向绑定

    程序比较简单,一看就明白,主要需要实现INotifyPropertyChanged using System; using System.Collections.Generic; using Syst ...

  2. linux4.10.8 内核移植（四）---字符设备驱动_led驱动程序

    一.字符设备驱动程序介绍 app里面用 open.read.write等等函数出来操作底层硬件.驱动程序中也有对应的xxx_open等函数.怎么找到驱动程序中的函数依赖于驱动程序框架. 二.搭建驱动程 ...

  3. Android ThreadPool

    在Android开发中,如果我们要执行某个耗时任务,一般都会考虑开启一个线程去处理. 一个线程run方法执行完毕后,才算真正结束:但是,这只是结束,并没有被回收:会一直闲置在那里,等待GC去回收.所以 ...

  4. SpringBoot2.x使用Dev-tool热部署

    SpringBoot2.x使用Dev-tool热部署 为什么使用热部署? 当修改某些文件内容如配置文件时,我们需要重新启动服务器,比较麻烦,需要一个工具来进行检测是否修改.热加载可以检测到修改的部分, ...

  5. cell下载图片的思路 --无沙盒（内存）缓冲

    // // ViewController.m // 06-表格图片下载 // // Created by jerry on 15/9/7. // Copyright (c) 2015年 jerry. ...

  6. 【逆向工具】IDA使用1-VS2015版本debug查找Main函数，加载符号文件

    IDA 常见操作 空格,切换反汇编视图 选择CALL或是跳转 进入函数内部或是跳转处 返回键 ESC daq.exe 分析32位程序 ,生成的IDA数据库文件是 .idb Idap64.exe 分析6 ...

  7. 用rand()和srand()产生伪随机数的方法总结 【转】

    转自:http://blog.chinaunix.net/uid-26722078-id-3754502.html 标准库(被包含于中)提供两个帮助生成伪随机数的函数: 函数一:int rand(vo ...

  8. C# 清理消息管道的消息

    using System;using System.Collections.Generic;using System.Linq;using System.Messaging;using System. ...

  9. nodejs 使用mysql 进行查询的问题

    因为返回的是个对象 var selectSql1="select * from spc_word_mst where WORD_ID=? limit 0,1 "var select ...

  10. windows命令行中英文切换

    Windows下cmd命令提示符窗口的语言设置(中英) 打开cmd命令提示窗口 输入 chcp 936 使用ping 命令 显示中文 2 同样 输入chcp 437 3 使用ping 命令