前端HTML面试

1. 【基础】请说出Xhtml和HTML的区别？

1、文档顶部doctype声明不同，xhtml的doctype顶部声明中明确规定了xhtml DTD的写法。

2、html元素必须正确嵌套，不能乱。

3、属性必须是小写的。

4、属性值必须加引号。

5、标签必须有结束，单标签也应该用“/”来结束掉。

2. 【基础】写出以下几个HTML标签：加粗、下标、居中、字体？

加粗：<b>、<strong> 下标：<sub> 居中：<center> 字体：<font>、<basefont>

3. 【基础】网页验证码是干嘛的，是为了解决什么安全问题？

1、区分用户是计算机还是人的程序。

2、可以防止恶意破解密码、刷票、论坛灌水。

4. 【中级】简述一下src与href的区别？

1、src用于替换当前元素；href用于在当前文档和引用资源之间确立联系。

2、src是source的缩写，指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位；href是Hypertext Reference的缩写，指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的链接。

5. 【中级】<image>标签上title属性与alt属性的区别是什么？

在alt和title同时设置的时候，alt作为图片的替代文字出现，title是图片的解释文字。

6. 【中级】form标签上定义请求类型的是哪个属性？定义请求地址的是哪个属性？

form表单定义请求类型的是 method 属性，定义请求地址的是 action属性。

7. 【中级】iframe框架有那些优缺点？

优点：

1、iframe能够原封不动的把嵌入的网页展现出来。

2、如果有多个网页引用iframe，那么你只需要修改iframe的内容，就可以实现调用的每一个页面内容的更改，方便快捷。

3、网页如果为了统一风格，头部和版本都是一样的，就可以写成一个页面，用iframe来嵌套，可以增加代码的可重用。

4、如果遇到加载缓慢的第三方内容如图标和广告，这些问题可以由iframe来解决。

缺点：

1、搜索引擎的爬虫程序无法解读这种页面

2、框架结构中出现各种滚动条

3、使用框架结构时，保证设置正确的导航链接。

4、iframe页面会增加服务器的http请求。

8. 【高级】很多网站不常用table、iframe这两个元素，知道原因吗？

因为浏览器页面渲染的时候是从上至下的，而table和iframe 这两种元素会改变这样渲染规则，他们是要等待自己元素内的内容加载完才整体渲染。用户体验会很不友好。

9. 【高级】cookies，sessionStorage和localStorage的区别？

共同点：都是保存在浏览器端，且是同源的。

区别：

1、cookies是为了标识用户身份而存储在用户本地终端上的数据，始终在同源http请求中携带，即cookies在浏览器和服务器间来回传递，而sessionstorage和localstorage不会自动把数据发给服务器，仅在本地保存

2、存储大小的限制不同。cookie保存的数据很小，不能超过4k，而sessionstorage和localstorage保存的数据大，可达到5M。

3、数据的有效期不同。cookie在设置的cookie过期时间之前一直有效，即使窗口或者浏览器关闭。sessionstorage仅在浏览器窗口关闭之前有效。localstorage始终有效，窗口和浏览器关闭也一直保存，用作长久数据保存。

4、作用域不同。cookie在所有的同源窗口都是共享；sessionstorage不在不同的浏览器共享，即使同一页面；localstorage在所有同源窗口都是共享。

10. 【高级】请用html知识解决seo优化问题？

1、meta标签，这个是重中之重

2、页面结构清晰，

3、logo，给logo图片添加h1标签、a链接连接到首页以及alt

4、img标签，img标签增加alt属性，这个logo的时候也提到了

5、h1~h6标签

6、前后端分离（vue、ajax）、flash不利于seo

7、增加外部链接。