学习总结使用,侵删。
1、css属性overflow属性
值 | 描述 |
---|---|
visible | 内容不会被修剪,会呈现在元素框之外。 |
hidden | 内容会被修剪,但是浏览器不会显示供查看内容的滚动条。 |
scroll | 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。 |
auto | 由浏览器决定如何显示。如果需要,则显示滚动条 |
2、定位
static
元素框正常生成。块级元素生成一个矩形框,作为文档流的一部分,行内元素则会创建一个或多个行框,置于其父元素中。
relative
元素框偏移某个距离。元素仍保持其未定位前的形状,它原本所占的空间仍保留。
absolute
元素框从文档流完全删除,并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭,就好像元素原来不存在一样。元素定位后生成一个块级框,而不论原来它在正常流中生成何种类型的框。
fixed
元素框的表现类似于将 position 设置为 absolute,不过其包含块是视窗本身。
3、跨域
1.CORS
CORS(Corss-Origin Resource Sharing,跨资源共享),基本思想是使用自定义的HTTP头部让浏览器与服务器进行沟通,从而决定请求或响应的成功或失败。即给请求附加一个额外的Origin头部,其中包含请求页面的源信息(协议、域名和端口),以便服务器根据这个头部决定是否给予响应。
2.document.domain
将页面的document.domain设置为相同的值,页面间可以互相访问对方的JavaScript对象。
注意:
不能将值设置为URL中不包含的域;
松散的域名不能再设置为紧绷的域名。
3.图像Ping
var img=new Image();
img.οnlοad=img.οnerrοr=function(){
... ...
}
img.src="url?name=value";
请求数据通过查询字符串的形式发送,响应可以是任意内容,通常是像素图或204响应。
图像Ping最常用于跟踪用户点击页面或动态广告曝光次数。
缺点:
只能发送GET请求;
无法访问服务器的响应文本,只能用于浏览器与服务器间的单向通信。
4.Jsonp
var script=document.createElement("script");
script.src="url?callback=handleResponse";
document.body.insertBefore(script,document.body.firstChild);
JSONP由两部分组成:回调函数和数据
回调函数是接收到响应时应该在页面中调用的函数,其名字一般在请求中指定。
数据是传入回调函数中的JSON数据。
优点:
能够直接访问响应文本,可用于浏览器与服务器间的双向通信。
缺点:
JSONP从其他域中加载代码执行,其他域可能不安全;
难以确定JSONP请求是否失败。
5.Comet
Comet可实现服务器向浏览器推送数据。
Comet是实现方式:长轮询和流
短轮询即浏览器定时向服务器发送请求,看有没有数据更新。
长轮询即浏览器向服务器发送一个请求,然后服务器一直保持连接打开,直到有数据可发送。发送完数据后,浏览器关闭连接,随即又向服务器发起一个新请求。其优点是所有浏览器都支持,使用XHR对象和setTimeout()即可实现。
流即浏览器向服务器发送一个请求,而服务器保持连接打开,然后周期性地向浏览器发送数据,页面的整个生命周期内只使用一个HTTP连接。
6.WebSocket
WebSocket可在一个单独的持久连接上提供全双工、双向通信。
WebSocket使用自定义协议,未加密的连接时ws://;加密的链接是wss://。
var webSocket=new WebSocket("ws://");
webSocket.send(message);
webSocket.onmessage=function(event){
var data=event.data;
... ....
}
注意:
必须给WebSocket构造函数传入绝对URL;
WebSocket可以打开任何站点的连接,是否会与某个域中的页面通信,完全取决于服务器;
WebSocket只能发送纯文本数据,对于复杂的数据结构,在发送之前必须进行序列化JSON.stringify(message))。
优点:
在客户端和服务器之间发送非常少的数据,减少字节开销。
只要 协议 、 域名 、 端口 有任何一个 不同, 都被当作是 不同 的域
3、
JavaScript 变量
与代数一样,JavaScript 变量可用于存放值(比如 x=2)和表达式(比如 z=x+y)。
变量可以使用短名称(比如 x 和 y),也可以使用描述性更好的名称(比如 age, sum, totalvolume)。
- 变量必须以字母开头
- 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
- 变量名称对大小写敏感(y 和 Y 是不同的变量)
提示:JavaScript 语句和 JavaScript 变量都对大小写敏感。
4、文档类型 dtd(Document Type Definition)
文档类型
DTD(文档类型定义)是一组机器可读的规则,他们定义 XML 或 HTML 的特定版本中允许有什么,不允许有什么。在解析网页时,浏览器将使用这些规则检查页面的有效性并且采取相应的措施。浏览器通过分析页面的 DOCTYPE 声明来了解要使用哪个 DTD ,由此知道要使用 HTML 的哪个版本。
DOCTYPE 当前有两种风格,严格( strict )和过渡( transitional )。过渡 DOCTYPE 的目的是帮助开发人员从老版本迁移到新版本。
如果发送具有正确的 MIME 类型的 XHTML 文档,理解 XML 的浏览器将不显示无效的页面。
浏览器模式
浏览器有两种呈现模式:标准模式和混杂模式(quirks mode)。在标准模式中,浏览器根据规范呈现页面;在混杂模式中,页面以一种比较宽松的向后兼容的方式显示。
DOCTYPE 切换
对于 HTML 4.01 文档,
- 包含严格 DTD 的 DOCTYPE 常常导致页面以标准模式呈现。
- 包含过度 DTD 和 URI 的 DOCTYPE 也导致页面以标准模式呈现。
- 但是有过度 DTD 而没有 URI 会导致页面以混杂模式呈现。
- DOCTYPE 不存在或形式不正确会导致 HTML 和 XHTML 文档以混杂模式呈现。