一、iframe有哪些缺点
iframe元素会创建一个包含另外一个文档的内联框架(即行内框架)
主要缺点:
(1)iframe阻塞页面的onload事件。window中的onload事件需要在所有iframe加载完毕后(也包含其中的元素)才会触发,在safari和chrome中,可以通过JavaScript来动态设置inframe中的src属性来避免这种阻塞情况
(2)搜索引擎的检索程序无法解读这种页面,不利于页面的SEO
(3)iframe和主页面共享连接池,而浏览器对相同域的连接有限制,会影响页面的并行加载
(4)浏览器的后退按钮会失效
(5)对一些小型的移动设备将无法完全显示框架
资料参考:
《使用 iframe 的优缺点》
https://blog.csdn.net/yintianqin/article/details/72625785
《iframe 简单探索以及 iframe 跨域处理》
https://segmentfault.com/a/1190000009891683
二、label的作用是什么?如何使用?
label 标签来定义表单控制间的关系,当用户选择该标签时,浏览器会自动将焦点转到和标签相关的表单控件上。对单选按钮而言,添加label标签可以让用户再点击文字时一样生效,属于优化的一点。
<label for="Name">Number:</label>
<input type=“text“ name="Name" id="Name"/>
三、HTML5 的 form 的自动完成功能是什么?
autocomplete 属性规定输入字段是否应该启用自动完成功能。默认为启用,设置为 autocomplete=off 可以关闭该功能。
自动完成允许浏览器预测对字段的输入。当用户在字段开始键入时,浏览器基于之前键入过的值,应该显示出在字段中填写的选项。
autocomplete 属性适用于 <form>,以及下面的 <input> 类型:text, search, url, telephone, email, password, datepickers, range 以及 color。
四、页面可见性(Page Visibility API) 可以有哪些用途?
这个api的意义在于,通过检测页面的可见性来预判网页的卸载,可以用来节省资源,节省电能的消耗。例如,一旦用户不看网页,下面的网页行为是可以停止的:
(1) 对服务器的轮询
(2) 网页动画
(3)音视频的播放与暂停
资料参考:
《Page Visibility API 教程》
http://www.ruanyifeng.com/blog/2018/10/page_visibility_api.html
五、Canvas 和 SVG 有什么区别?
Canvas是一种通过JavaScript来绘制2D图形的方法。Canvas是逐像素进行渲染的,因此我们对Canvas进行缩放时,会出现失真或出现锯齿的情况。
SVG是一种使用XML描述2D图形的语言。SVG基于XML,这意味者SVG DOM 中的每一个元素都是可以使用的,我们可以为其中的某个元素添加JavaScript事件监听函数。SVG中保存的是图形的绘制方法,对SVG图形进行放大和缩小是不会出现锯齿和或失真的情况。
资料参考:
《SVG 与 HTML5 的 canvas 各有什么优点,哪个更有前途?》
https://www.zhihu.com/question/19690014