在乎者也
在乎者也

HTML 知识总结

HTML、XML、XHTML 有什么区别

什么是HTML

HTML 是用来描述网页的一种语言

  • HTML 指的是超文本标记语言（hyper text Markup Language）
  • HTML 不是一门编程语言， 而是一中标记语言（markup language）
  • 标记语言是一套标记标签 （markup tag）
  • HTML 使用标记标签 来描述网页

总结：HTML 是一个超文本标记语言，并不是编程语言，他有一套标记标签，可以使用这些标记标签来描述网页

什么是XML

XML 被设计用来传输和存储数据

  • XML是可扩展标记语言（Extensible Markup Language）
  • Xml 是一种标记语言，很类似HTML
  • XML 的设计宗旨是传输数据， 而非显示数据
  • XML 标签没有被预定义。 你需要自定义标签
  • XML 被设计为具有 自我描述性
  • XML 是W3C 的推荐标准
    解释：
    自定义标签： XML 就是纯文本，标签是根据自己的数据内容可以自定义。不像 HTML 标签 有个预定义的意思 比如 h1~h6 代表标题等等
    ** 自我描述性** XML标签往往对标签内的数据有所解释
 
George // 去George那
John // 来自 John
Reminder// 信息头 
Don't forget the meeting!// 信息体

总结：
XML 是一个可扩张标记语言，类似HTML；设计宗旨是传输数据，它没有预定义标签，全部都要自定义标签，自定义的标签应当定义为对自己数据具有自我描述性，XML也只是个纯文本，想解析XML信息还需自己编辑软件或程序解析。XML是为了数据更加明确。能够读懂 XML 的应用程序可以有针对性地处理 XML 的标签。标签的功能性意义依赖于应用程序的特性。XML 是独立于软件和硬件的信息传输工具

什么是 XHTML

XHTML (extensible HyperText Markup language) 可扩展超文本标记语言
XHTML 是一种 html 4.0 基础上优化和改进的新语言，目的是基于XML应用，XHTML是一种增强了的HTML， 他的可扩展性和灵活性将适应未来网络应用更多的需求

  • XHTML 元素必须被正确的嵌套
  • XHTML 元素必须被关闭
  • 标签必须用小写字母
  • XHTML 文档必须有根元素

怎样理解 HTML 语义化

** 1. 什么是HTML语义化**
根据内容的结构化（内容语义化），选择合适的标签（代表语义化）便于开发者阅读和写出优雅的代码的同事让浏览器的爬虫 和 机器很好的解析
2. 为什么要语义化

  • 为了在没有CSS的情况下，页面也能呈现出很好地内容结构、代码结构:为了裸奔时好看
  • 用户体验：例如title, alt 用于解释名词或解释图片信息，
  • HTML 是一门计算机程序语言,和c,c++,java,go,php,lua,python等一样.
    写HTML的人要以写程序的角度去写,去评判,
    语义化的含义就是用正确的标签做正确的事情.
    你要写的是程序, 不仅仅是视觉显示.
  • 更好看懂 更好维护 记单词一样 有逻辑关系的单词 可以记一串 零散的看都不想看
    参考链接
    关于语义化 HTML 以及前端架构的一点思考
    如何理解 web 语义化

怎么理解内容与样式分离原则

1.内容
内容就是页面实际要传达的真正信息，包括数据、文档或者图片等。这里强调”真正“，指的是纯粹的数据信息本身，导航菜单，装饰性图片都不算的
2.结构（Structure）
真正信息想让展现给大家，一定其看懂。没结构的话会混乱不堪，难以阅读和理解，所以需要格式化，结构化。
比如分成标题 作者 章 节 段落 和列表等等（语义化使用html标签，使得传达的信息结构化）结构使内容更加具有逻辑性，易用性
3.表现
结构化可以让人看得懂，但是我们还应当让人看得舒服
虽然定义了结构，但是字体大小，正文的颜色 字体样式 所处位置 背景什么都没有修饰，所有来改变内容（结构化后真正的数据信息）外观的东西，我们称为 表现
4.总之
内容是模特， 结构表明头 和 四肢等各个部位，表现则是服装，化妆品，将模特更光彩照人
** 5. 行为（Behacior）**
即对内容的交互及操作效果
这些是现代网页必须存在的东西，表现层 和 结构层 内容层 行为都可以写在一起，一些简单的页面没关系，如果发布大量页面 问题就来了

  1. 如何改版 背景改成黑的 文字改成白的 一个页面一个页面改 有css表 的话 直接改样式表 样式就批量改了
  2. 数据的利用 结构清晰化，将内容、结构与表现相分离。使用模板为类似的内容搭个结构，将请求回来的数据嵌入或隐藏（根据业务）这样也可以达到批量修改结构 去除模板的一个解构 渲染出来的页面就会都会修改，等等 解构化更有利于浏览器搜索

常见的meta标签

：编码方式 大部分都是utf-8格式

双核浏览器

用于移动端的展示合理 移动端必用
网页关键字，利于搜索 优化SEO

搜索引擎优化 
 //向搜索引擎说明你的网页的关键词  
 //告诉搜索引擎你的站点的主要内容  
 //告诉搜索引擎你的站点的制作的作者  
 //指定字符集  
 //定时让网页在指定的时间n内跳转  
 //可以用于
设定网
页的到期时间，
一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式  
 //禁用缓存  
 //cookie设定，
如果网页过期，存盘的cookie将被删除。需要注意的也是必须使用GMT时间格式

文档声明的作用?严格模式和混杂模式指什么? 的作用?

** 文档声明 **
为了浏览器按照你给的版本进行解析你的HTML文档
严格模式 ， 混杂模式
严格模式：浏览器按照HTML 和 CSS标准来解析，渲染你的文档
混杂模式：浏览器会模拟网景浏览器 和 ie5 的非标准行为来解析渲染页面 ，这样做为了兼容W3C标准没出来之前的页面 ，（我猜这些页面早见鬼去了吧）
的作用
html5 文档声明 让浏览器进入 W3C HTML5标准模式解析渲染页面，不写进入混杂模式，准备踩坑吧

浏览器乱码的原因是什么？如何解决

  1. 文件存储格式 与 这个meta标签指定格式不同 导致乱码
    解决： 存储格式 与 meta指定格式一样
  2. 不合理的字符串截取造成个别字符乱码，
    解决 规范截取字符串函数
  3. 数据库编码与meta设定不一致
    解决 保持一致
  4. ajax传递中文编码导致的
    解决将传递的参数转码成utf-8模式
  5. 网站中毒导致
    解决“网站安全”相关处理

常见的浏览器有哪些，什么内核

    chrome safari opera 现在都是使用WebKit内核
    Firefox 内核 Gecko
    IE 内核 Trident
    猎豹安全浏览器：1.0-4.2版本为Trident+Webkit，4.3版本为        Trident+Blink；
    360安全浏览器 ：1.0-5.0为Trident，6.0为Trident+Webkit，7.0为Trident+Blink；
    360极速浏览器：7.5之前为Trident+Webkit,7.5为Trident+Blink；
    傲游浏览器 ：傲游1.x、2.x为IE内核，3.x为IE与Webkit双核；
    搜狗高速浏览器：1.x为Trident，2.0及以后版本为Trident+Webkit；
    QQ浏览器开始使用Webkit和Trident双内核
    微信内置浏览器 腾讯自己X5内核

列出常见的标签，并简单介绍这些标签用在什么场景

摘抄自列出常见的标签，并简单介绍这些标签用在什么场景

*  用于超链接。some text
* 
 用于一篇文章。
a self-contained article

*