Question

我尝试使用HTML5导入导入2个文件。

  <link rel="import" href="/pages/templates/menuAdmin.html">
  <link rel="import" href="/pages/templates/header.html">

但我不知道如何获得第二个。我有一个js文件，但我不知道下一步该怎么做

var doc= document.querySelector('link[rel="import"]').import;
console.log(doc);
var text = doc.querySelector('template');
var clone = document.importNode(text.content, true);
document.querySelector('.sidebar-menu').appendChild(clone);

Answer 1

使用querySelectorAll

var doc= document.querySelectorAll('link[rel="import"]').import;

然后将其用作数组

doc[0]
doc[1]

Answer 2

要获取所有imports，您必须使用querySelectorAll并对项目进行迭代。

var docs = document.querySelectorAll('link[rel="import"]').import;

for(var i = 0; i < docs.length; i++) {
    doc = docs[i];
    console.log(doc);
    var text = doc.querySelector('template');
    var clone = document.importNode(text.content, true);
    document.querySelector('.sidebar-menu').appendChild(clone);
}

HTML5两个或更多导入

2 个答案: