阅读 65

HTML面试题收集

ReadOnly和Disabled有何区别

相同点:都是使用户不能更改作用域中的内容

不同点:

  1. ReadOnly只对input(text/password),textarea有作用。Disabled对所有的表单元素有效,如:Radio, Select,checkBox,button等。
  2. 在表单进行POST/GET请求时,Disabled能阻止表单元素值的提交,而ReadOnly依然会将值传递出去。

src和href的区别

都是引用外部资源

src:指向对资源的引用,它指向的资源会嵌套在引用的标签内,会将资源下载到当前运用文档中,如对JS的引用,会暂停其他资源的加载,先将当前内容下载,执行完再进行下一步,所以一般会将JS的引用放在最后。

href:对超文本内容的引用,指向一些网络资源,建立和当前元素的链接关系。当浏览器识别到它指向的资源时,会对其并行下载,不会停止对当前文档的处理。如a,link标签。

script标签中defer和async的区别

执行顺序:多个带async的标签不能决定执行顺序,但是多个带defer的标签会按照顺序执行。

脚本是否并行执行:async表示在文档的加载与执行与JS的执行是并行执行的,即异步处理。defer表示在文档的加载和JS的加载(只加载不执行)是并行执行的,JS脚本需要等到所有元素被解析完成之后再去执行。

HTML5有哪些更新

  • 语义化标签:header,nav,footer,aside,article,section

  • 媒体标签:video,audio,source

  • 数据存储:sessionStorage,localStorage

  • canvas,svg,拖拽

  • input标签新增属性: placeholder,autocomplete,autofocus,required

title与h1的区别、b与strong的区别、i与em的区别?

  1. strong更有语义化,起到加强语气的作用,而b标签只是一个简单的加粗的标签
  2. i侧重于斜体字体,em则侧重文本
  3. title标签是整个页面的标题,他包含了H1,而H1表示文章的标题。

label 的作用是什么?如何使用?

用label标签来定义与表单控件的关系:当用户选择label标签是,浏览器会将焦点自动转到对应的表单控件上。

从输入网址(URL)到页面显示的过程

  1. 首先对输入的URL进行DNS域名解析,得到对应的IP地址
  2. 获取到IP地址后,找到对应的服务器进行TCP连接(三次握手)
  3. 建立TCP连接,发起http请求
  4. 服务器响应http请求,得到html代码
  5. 浏览器解析html代码,并得到html中js,css,图片等资源
  6. 浏览器渲染代码呈现给用户
  7. 断开TCP连接(四次挥手)

display:none和visibility:hidden的区别

display:none : 对元素进行隐藏,此时元素不占用页面空间

visibility:hidden : 让元素不可见,元素仍然占用着当前的空间

display:none属性值改变后会重新渲染,而visibility:hidden则不会

link 是干嘛的,和 @import 有什么区别

  1. 从属关系:@import是css提供的语法规则,只能做导入样式作用,而link是html的标签,不仅可以加载CSS文件,还能定义rel与RSS连接属性
  2. 兼容性:@import是css2.1才有的语法,所以只能在IE5以上才能使用,而link作为html标签元素,不存在兼容性
  3. 加载顺序:link引入的CSS加载执行是同步进行,而@import要等页面加载完之后才执行
  4. DOM可控性:通过JS插入link来改变样式,而@import不行
文章分类
前端
文章标签