html5小知识点

1、兼容性问题:

  • 对于不支持H5标签的浏览器,可以使用javascript来解决他们。然后在样式表中对这些标签定义一下默认的display:block。
  • 采用第三方库:html5shiv.js
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title></title>
 6         <style type="text/css">
 7             header,nav,section{display: block;}
 8         </style>
 9     </head>
10     <body>
11     </body>
12 </html>
13 <script type="text/javascript">
14     document.createElement("header");
15     document.createElement("nav");
16     document.createElement("section");
17 </script>

 2、新增选择器:

  • querySelector():返回文档中匹配指定 CSS 选择器的一个元素。(仅仅返回匹配指定选择器的第一个元素)。
  • querySelectorAll():返回一个对象数组。
  • getElementsByClassName():返回一个对象数组。
  • 获取class列表属性:oDiv.classList。 length:class的长度; add():添加class方法,remove():删除class;toggle()切换class。

3、JSON的新方法:

  • parse():把字符串转换为json对象。字符串中的属性要严格的加上引号。
  • stringify():把json对象转换为字符串。会自动把双引号加上。
  • 应用:深度克隆新对象,避免使用递归赋值。
  • 兼容性问题:json2.js。

4、自定义属性:

  • dataset
  • 配置:data-attrname, js中获取:dataset.attrname。
  • data-name-first:dataset.nameFirst。

5、延迟加载:

  • defer:延迟加载,会按顺序执行,在onload执行前被触发。
  • async:异步加载,加载完就触发,有顺序问题。
原文地址:https://www.cnblogs.com/tengri/p/5558708.html