欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
  HTMLimports提供了一种在一个HTML文档中包含和重用另一个HTML文档的方法。目前谷歌已经全面支持HTMLimports,Opera35版本之后支持,但是FF依旧不支持。(在谷歌的地址栏输入:chrome://flags,启动或禁止一些功能)。尽管目前HTMLimports的兼容不是很好,但是我们还是有必要了解其使用方法,W3C已经发布了HTMLimports的标准草案,相信后期应该还是会用得比较普遍的。使用HTMLimports
 
  
 
  <!doctypehtml>
 
  <html>
 
  <head>
 
  <!--网站编码格式,UTF-8国际编码,GBK或gb2312中文编码-->
 
  <metahttp-equiv="content-type"content="text/html;charset=utf-8"/>
 
  <metaname="Keywords"content="关键词一,关键词二">
 
  <metaname="Description"content="网站描述内容">
 
  <metaname="Author"content="YvetteLau">
 
  <title>Document</title>
 
  <linkrel="import"href="test1.html"/>
 
  </head>
 
  <body>
 
  <divid="content"></div>
 
  </body>
 
  </html>
 
  <script>
 
  varpost=document.querySelector("link[rel='import']").import;
 
  varcon=post.querySelector("div");
 
  document.querySelector("#content").appendChild(con.cloneNode(true));
 
  varclone=document.importNode(con,true)
 
  document.querySelector("#content").appendChild(clone)
 
  </script>
 
  给出了两种将import进来的html中我们需要的部分插入到当前html.
 
  最后简单介绍document.querySelector和document.querySelectorAll,这两个方法是HTML5在WebAPI中新引入的方法,大大简化了在原生Javascript代码中选取元素。
 
  document.querySelector和document.querySelectorAll都是接收一个字符串作为参数,这个参数需要符合CSS选择语法,即:标签、类选择器、ID选择器,属性选择器(E[type=”XX”]),结构选择器(:nth-child(n))等。不支持伪类选择器。
 
  document.importNode(node,deep)方法把一个节点从另一个文档复制到该文档以便应用,第二个值为true,那么将该节点的所有子孙节点也复制过来。
 
  node.cloneNode(deep):对已有的节点进行克隆,deep值为true,表示克隆其子孙节点。如果deep为false,则只克隆该节点自身。





本文转载自中文网
 

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/html/h54652.shtml