美文网首页Web前端之路
前端知识点系列一:HTML

前端知识点系列一:HTML

作者: 娜姐聊前端 | 来源:发表于2017-03-05 23:19 被阅读110次

    持续更新......

    1. Doctype作用

    • <!DOCTYPE>声明位于位于HTML文档中的第一行,处于 <html>标签之前。告知浏览器的解析器用什么文档标准解析这个文档。
    • DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。

    Doctype有三种类型:

    | 类型 | 说明 | 代码 |
    | :--- | :--- |
    | Strict | 包含所有 HTML 元素和属性,但不包括展示性的和弃用的元素(比如 font);不允许框架集(Framesets) | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    | Transitional | 包含所有 HTML 元素和属性,包括展示性的和弃用的元素(比如 font);不允许框架集(Framesets) | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">|
    | Frameset | 等同于 HTML 4.01 Transitional,但允许框架集内容 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">|

    注意:

    HTML5不需要制定Doctype类型,因为:

    HTML5 不基于 SGML,因此不需要对DTD进行引用,但是需要doctype来规范浏览器的行为(让浏览器按照它们应该的方式来运行);
    而HTML4.01基于SGML,所以需要对DTD进行引用,才能告知浏览器文档所使用的文档类型。
    

    2. cookies,sessionStorage 和 localStorage 的区别

    • cookie是网站为了标示用户身份而储存在用户本地终端(Client Side)上的数据(通常经过加密)。
    • cookie数据始终在同源的http请求中携带(即使不需要),记会在浏览器和服务器间来回传递。
    • sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。
    存储大小
    • cookie数据大小不能超过4k。
    • sessionStorage和localStorage 可以达到5M或更大。
    有期时间
    • localStorage 存储持久数据,浏览器关闭后数据不丢失除非主动删除数据;
    • sessionStorage 数据在当前浏览器窗口关闭后自动删除。
    • cookie 设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭

    注意:不同浏览器tab之间(同一个url),不共享sessionStorage,但是,会共享localStoragecookie

    3. iframe有那些缺点?

    • iframe会阻塞主页面的Onload事件;
    • 搜索引擎的检索程序无法解读这种页面,不利于SEO;
    • iframe和主页面共享连接池,而浏览器对相同域的连接有限制,所以会影响页面的并行加载。

    通过javascript 动态给iframe添加src属性值,可以避免这两个问题。

    3. 如何实现浏览器内多个标签页之间的通信

    • WebSocket
    • 调用localstorge、cookies等本地存储方式

    localstorge另一个浏览上下文里被添加、修改或删除时,它都会触发一个事件, 通过监听事件,控制它的值来进行页面信息通信

    4. ASCII,Unicode和UTF-8区别

    • ASCII:将英文字符映射为二进制的字符编码
    • Unicode:包含全世界所有字符的集合。它只规定了字符的二进制代码,却没有规定如何存储这个二进制代码(一个字符可能需要多个字节,一个字节是8位二进制)
    • UTF-8:实现Unicode的一种编码方式。它是一种变长的编码方式,用1~4个字节表示一个符号,根据不同符号而变化字节长度。

    相关文章

      网友评论

        本文标题:前端知识点系列一:HTML

        本文链接:https://www.haomeiwen.com/subject/aoxygttx.html