一、昨日内容回顾
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>
2. HTTP中application/x-www-form-urlencoded字符说明
https://blog.csdn.net/qq_28702545/article/details/51719199