1.URL
1.URL的作用
用于来表示任意一个资源的位置(互联网上)。

协议+主机名+文件目录结构+文件名称
2.详解
格式:
<scheme>://<user>:<pwd>@<host>:<port>/<path>:<params>?<query>#<frag>
scheme:方案,协议,以哪种方式到服务器获取资源,协议不区分大小写,常用协议:http,https,ftp
user:用户名
pwd:密码
host:主机名 localhost
port:端口
path:路径,资源在服务器上具体的存放位置
params:参数
query:查询字符串,要传递给服务的数据
http:127.0.0.1/update.php?uid=1&uname=dangdang&upwd=123
frag:锚点
http://127.0.0.1/a.html#NO1
2.HTTP协议
1.什么是HTTP
Hyper Text Transfer Protocol:超文本传输协议。
规范了数据是如何打包以及传递的。
2.历史
发展史
现用版本:http/1.1
3.详解
1.请求(Request)消息
客户端带给服务器端的信息都有哪些,由三部分组成:请求起始行,请求头,请求主体
1.请求起始行
1.请求方法
1.GET
表示客户端获取服务器资源时使用
特点:
1.无请求主体
2.靠地址栏传递查询字符串
2.POST
表示想要传递数据给服务器时使用
特点:有请求主体
3.DELETE 表示客户端要删除服务器数据(一般禁用)
4.PUT 表示客户端想放置文件到服务器
5.HEAD 表示客户端只想获取指定的响应头
6.CONNECT 测试连接
7.TRACE 追踪请求路径
8.OPTIONS 选项,保留以后使用
2.请求URL
3.协议版本 HTTP/1.1
2.请求头
1.Host:localhost
作用:告诉服务器请求哪个主机
2.Connection:keep-alive
作用:告诉服务器要进行持久连接。
3.User-Agent:
作用:告诉服务器自己(浏览器)的类型。
4.Accept-Language:zh-cn
作用:告诉服务器能接收的自然语言。
5.Accept-Encoding:gzip
作用:告诉服务器能接收的数据压缩类型是什么。
6.Referer:HTTP://127.0.0.1/login.html
作用:告诉服务器请求来自哪个页面。
3.请求主体
Form Data

2.响应(Response)消息
1.响应起始行
1.协议版本:http/1.1
2.响应的状态码
作用:告诉浏览器,服务器的响应状态是什么.
1XX:100-199,提示信息
2XX:成功响应
200:ok
3XX:需要进行重定向
301:永久性重定向
302:临时重定向
304:Not Modified (请求没修改,命中缓存)
4XX:客户端请求错误
404:Not Found请求资源不存在
403:Forbidden 权限不够
405:Method Not Allowed 请求方法不被允许
5XX:服务器运行错误
500:服务器内部错误
3.原因短句
对状态的简单解释
2.响应头
1.Date
作用:告诉浏览器,服务器的响应时间(格林尼治)
2.Connection
作用:告诉浏览器已经启动持久连接
3.Content-Type:
作用:响应主体的类型是什么,告诉浏览器用什么样的方式来解析响应主体。
1.text/html:响应回来的数据是html文本
2.text/plain:响应回来的数据是普通文本
3.text/css:响应回来的数据是CSS样式
4.application/javascript:响应回来的数据是js文件
5.application/xml:响应回来的数据是xml格式字符串
6.application/json:响应回来的数据是json格式字符串
7.image/jpeg:响应回来的数据是图片

3.响应主体
Response
3.缓存
1.什么是缓存
客户端将服务器响应回来的数据进行自动的保存,当再次访问时,直接使用保存的数据。
2.缓存的优点
1.减少了冗余数据的传输,节省客户端的流量
2.可以节省服务器带宽
3.降低了对服务器资源的消耗和运行要求
4.降低了由于远距离而造成的延时加载
3.与缓存相关的消息头
1.Cache-Control消息头
作用:从服务器将文档传递到客户端之时起,此文档处于新鲜的秒数
语法:Cache-Control:max-age=处于新鲜的秒数
ex:
Cache-Control:max-age=3600;
2.Expires消息头
作用:指定缓存过期确切时间
语法:Expires:Thu,23,Nov 2017 07:00:00 GMT

4.在网页中设置消息头
html:
<meta http-equiv="消息头" content="值">
ex:
<meta http-equiv="Cache-Control" content="max-age=3600">
4.DOM操作
1.完整的javascript的组成
1.JS核心:ECMAScript
2.DOM:Document Object Model
文档对象模型
让js动态的操作页面的元素
3.BOM:Browser Object Model
浏览器对象模型
让js动态的操作浏览器
2.使用js获取页面上的某个元素
在js中,允许通过元素的ID来获取页面的指定元素
var ele=document.getElementById("元素ID");
练习:
1.在网页中创建一个div,并定义id值,div中的内容随意
2.在页面中创建一个按钮,点击时,将div元素获取出来,并打印在控制台,观察结果。
3.获取/设置元素中的内容
DOM对象的一个属性:innerHTML
表示的是标签内的所有内容
练习:
1.页面中新建一个段落元素,设置id为p1,内容随意。
2.在页面中添加一个按钮,点击时,获取p元素中的文本,并打印在控制台。
3.再添加一个按钮,点击时,将p元素中的文本设置为“这是我的第一个DOM操作”。
4.获取/设置表单控件的数据
在DOM中,表单控件们,是通过DOM对象的value属性来获取/设置值的。
步骤:
1.通过id获取表单控件
2.通过value属性获取/设置控件的值
练习:
页面中创建一个文本框id为uname,再创建一个div元素,id为d1,再添加一个按钮到页面,点击按钮时,将文本框中的数据,显示在div中。
封装js函数:
1.创建一个独立的js文件(以.js为结尾的文件)
2.在js文件中封装$()函数,函数接收一个id值作为参数,函数返回DOM对象。
3.点击按钮时,调用$()函数,将文本框中的数据以一级标题显示在div中。
5.HTML元素事件
1.什么是事件
允许通过用户的行为来激发的操作就是事件。
常用事件:onclick
2.其它事件
1.文本框和密码框-onblur
onblur事件:失去焦点
2.文本框和密码框-onfocus
onfocus事件:获取焦点
3.body的onload事件
当网页加载时要执行的操作。

AJAX-URL-HTTP协议-缓存-DOM操作-HTML元素事件的更多相关文章

  1. DOM操作标签、事件绑定、jQuery框架/类库

    DOM操作标签 ''' 在起变量名的时候 如果该变量指向的是一个标签 那么建议使用 xxxEle eg:aEle\pEle\divEle\spanEle ''' # 动态创建一个a标签并添加到页面指定 ...

  2. DOM操作标签,事件绑定,jQuery框架

    DOM操作标签 ''' 在起变量名的时候 如果该变量指向的是一个标签 那么建议使用 xxxEle eg:aEle\pEle\divEle\spanEle ''' 基本使用 动态创建一个标签 var 变 ...

  3. jQuery使用(六):DOM操作之元素包裹、克隆DOM与data的综合应用

    包裹 wrap() wrapInner() wrapAll() unwrap() clone() 数据缓存机制 data 文档处理(包裹) 1.1.wrap()--将所匹配的元素用其他元素结构化标签包 ...

  4. jQuery 第二章 实例方法 DOM操作选择元素相关方法

    进一步选择元素相关方法:  .get() .eq() .find() .filter() .not() .is() .has() .add()集中操作  .end()回退操作 .get() $(&qu ...

  5. DOM操作-克隆元素

    代码: ———————————————————————————— <script type="text/javascript">            //克隆元素   ...

  6. javascript的DOM操作获取元素

    一.document.getElementById()    根据Id获取元素节点 <div id="div1"> <p id="p1"> ...

  7. dom操作------获取元素的若干方法

    // 1,getElementById:返回元素节点document.getElementById(); // 2,getElementsByClassName:返回HTMLCollection对象( ...

  8. JavaScript的DOM操作获取元素的大小

    通过 style 内联获取元素的大小 需要注意的是style 获取只能获取到行内 style 属性的 CSS 样式中的宽和高,如果有获取:如果没有则返回空. <!DOCTYPE html> ...

  9. JavaScript的DOM操作获取元素实际大小

    clientWidth 和 clientHeight 这组属性可以获取元素可视区的大小,可以得到元素内容及内边距所占据的空间大小. 返回了元素大小,但没有单位,默认单位是 px,如果你强行设置了单位, ...

随机推荐

  1. js中获取一个对象里面的方法和属性的javascript

    <script type="text/javascript"> var obj = { attribute:1, method:function() { alert(& ...

  2. redismyadmin安装(支持redis4 集群模式)

    yum install php-pecl-redis https://github.com/daivem/RedisMyAdmin下载最新的安装包,解压yum install nginx php ph ...

  3. poj2970 The lazy programmer 【优先队列】

    A new web-design studio, called SMART (Simply Masters of ART), employs two people. The first one is ...

  4. ACM-ICPC 2018 南京赛区网络预赛 L.Magical Girl Haze(分层最短路)

    There are N cities in the country, and M directional roads from u to v(1≤u,v≤n). Every road has a di ...

  5. [Mysql]——通过例子理解事务的4种隔离级别(转)

    第1级别:Read Uncommitted(读取未提交内容) 第2级别:Read Committed(读取提交内容) 第3级别:Repeatable Read(可重读) 第4级别:Serializab ...

  6. 我的开发小tip

    开发原则:1.谁开发,谁负责到底.自己的开发的模块自己维护,不要让别人替你维护,否则很麻烦:2.合理分配时间3.谨慎的处理遇到的bug和问题,不是自己开发的不要轻举妄动,提交到待办中即可4.万勿过度设 ...

  7. linux操作系统-设置静态ip

    在使用linux虚拟机的时候因为经常有关机的需求,然后重新开机后可能面临这上一次获取的ip被改变,在这里我分享一下在linux 下设置静态ip的经验 1.查看路由状态 [root@localhost ...

  8. qrcodenet二维码图片下扩展区域添加号段的操作

    总监安排了个任务,一个号码导出一个二维码图, 我实现了最终还能批量生成,结果主管说要在图片下边添加一行,和图片是一起的 最开始把控件的上的图给改了,结果保存起来没用,控件上的图跟要保存的不是一个事. ...

  9. Oracle_SQL(6) 单行函数

    一.单行函数1.定义:对表或视图的查询时,针对每行记录返回一个值的函数.2.用途:用于select语句,where条件3.分类: 数值函数 Number Functions 字符函数(返回字符) Ch ...

  10. angular2.0学习笔记2.创建hello world项目

    1.打开终端命令行窗口 2.切换到指定目录 E:\cd myobject 3.创建新项目 ng new angular2-helloworld 4.创建成功后,在angular2-helloworld ...