一、昨日内容回顾

　　　　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. Syncfusion HTMLUI研究一

    HTMLUI可以加载HTML页面,并且相比WebKit等占用资源特别少 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitiona ...

  2. IntelliJ IDEA AndroidStudio SVN无法使用

    1.Cann't Run Program "SVN" 把勾都去掉,结果没有任何反应.2.重新安装TotoriseSVN,设置Svn.exe路径,主要不要勾选Enable Inter ...

  3. mipsel汇编指令学习

    MIPS汇编语言基础 MIPS的系统结构及设计理念比较先进,其指令系统经过通用处理器指令体系MIPS I.MIPS II.MIPS III.MIPS IV.MIPS V,以及嵌入式指令体系MIPS16 ...

  4. QA系统Match-LSTM代码研读

    QA系统Match-LSTM代码研读 背景 在QA模型中,Match-LSTM是较早提出的,使用Prt-Net边界模型.本文是对阅读其实现代码的总结.主要思路是对照着论文和代码,对论文中模型的关键结构 ...

  5. Failed to load or instantiate TagLibraryValidator class: org.apache.taglibs.standard.tlv.JstlCoreTLV

    今天在使用JSP,引入<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> ...

  6. SpringBoot三种配置Dubbo的方式

    *必须首先导入dubbo-starter (1).使用SpringBoot配置文件(application.properties或application.yml) dubbo.application. ...

  7. dell R720服务器设置开机启动顺序

    开机按F2进入系统启动设置,也可以按F11进入快速启动配置

  8. Android Menu用法全面讲解

    说明:本文只介绍Android3.0及以上的Menu知识点. 菜单的分类 菜单是Android应用中非常重要且常见的组成部分,主要可以分为三类:选项菜单.上下文菜单/上下文操作模式以及弹出菜单.它们的 ...

  9. 安装sass报错

    ERROR in Cannot find module 'node-sass' 执行:npm install sass-loader node-sass webpack --save-dev即可

  10. VS2017项目程序打包成.msi或者.exe

    VS2017项目程序打包成.msi或者.exe 1.安装打包插件:Microsoft Visual Studio 2017 Installer Projects 打开vs2017 ,选择 工具 --& ...