Html 无法从第二次导入中选择查询

我定义了2个导入

index.html

导入测试 加载导入'import1'； 加载导入'import2'； import1.html

进口1 import2.html

进口2 scripts.js

函数loadImportname{ var link=document.querySelector'link[rel=import]； var content=link.import； var el=content.querySelector'.+name； document.body.appendChildel.cloneNodetrue； }

---

只有第一次导入才能正常工作。content.querySelector的结果第二秒为空。如果我在index.html中对第一次导入进行注释，那么第二次导入可以工作。我做错了什么？Chromium浏览器版本75.0.3770.100。

您使用了错误的选择器-document.querySelector将只返回找到的第一个匹配项-这就是为什么您的代码适用于第一个匹配项而不是第二个匹配项-它只会匹配第一个匹配项

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

您需要使用document.querySelectorAll，然后对它们进行迭代以访问它们，这意味着您实际上只需要对导入函数进行一次调用

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

或者使用索引只获取所需的导入-即第二个导入链接

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