2020-09-05

javascript 使用，

当import javascript file到html,就会运行，顺序运行

DOM Document Operation Model

window include document-> html pages
Function:
document.getElementById
document instanceof HTMLDocument
document.querySelector: id: #xxx, class .xxx h1 h2
document.querySelector(“button”).οnclick=sayHello or document.querySelector(“button”).addEventListener(“click”,sayHello): it will intrigue the event and make the this pointer to the button
document.addEVentListener(“DOMContentLoaded”, function(event){})

Feature:
textContent, value
the difference between textContent and innerHTML is that it contain tag

note: the type only object pass the reference，but other pass the value, 然后就是html有很多feature tag, 比如最常见的id, class, onclick, onblur, type, 有些就是大名鼎鼎的事件标签，当某个时间发生，function才会触发， clientX, clientY,表示指针的位置, mouseEvent也有很多属性，shiftKey, clientX, clientY也是

Lecture 57 REQUEST AND RESPONSE

Ajax:
HyperText Transfer Protocol(HTTP),
URI: Uniform Resource Identifier, doesn’t tell the detailed how to get it
(doesn’t contain http website)

Resquest:
GET URI String?Query String HTTP version -> Command after it is connected after the HTTP protocol
POST /index.html HTTP/1.1
Host:
Accept-Charset: utf-8
firstname:

Response Structure:
Http/1.1 200 OK
Date: Tue, 11 Aug 2004 19:00:01 GMT
Content-Type: text/html

whole new pages

我们都知道TCP三次握手这种动作，但是这个握手，ｒｅsponse怎么具体实现，这就需要POST，RESPONSE，
根据我对server, client的理解是这样的， 就是有个server一直等client 的来信，client来连接（request），我就抽取request 的信息（字符串提取的知识），发送对应的(response)， client 接受response以后进行处理什么的，至于三次握手都已经被代码覆盖了，也就是说代码帮我们干了，我们不需要考虑太多，只需要看这些response, request 的信息如何提取就好了

Traditional web flow: send the http resquest and the total website html back

Ajax, Asynchronous Javascript and XML,

it will seperate some small pieces into javascript part
ajax-utils.js
总结：这是一个事件触发的东西， 比如说如果某个事件发生，但是我要的资源是在另外一台服务器，所以我就需要把这台服务器里面的东西拿过来，需要http协议， 但是一般的http协议就会传送整个网页内容，这样就会非常慢， 所以建议就是只传我需要的一部分，这就出现了XMLHTTP, 从名字可以看出这个就是表的意思
另外，不要把http看的太复杂，其实就是open file的高阶版，因为这个设置了很多的验证信息来确保正确性，所以也可以用到file打开这一方面，但是太麻烦，所以不建议， xmlhttp.onreadystatechange=function(){}, 这个就是get的时候会返回调用的函数：

使用 AJAX 修改该文本内容

修改内容 今天的内容就到这了，大家一起加油