让说我有这个div里面的html文件：如何从导入html的文档中查询选择元素？
div.html
<div class="thediv">
<h1>test</h1>
<p class="insert"></p>
</div>
从的index.html，我将其导入现在
<link rel="import" href="/path/to/div.html">
如果我键入控制台或脚本
const div = document.querySelector('.thediv');
div是null，好像div刚刚消失。但是我相信有一种方法可以选择元素，因为一些webcomponents库允许程序员逐个定义自己的自定义元素。
我尝试了很多东西，但找不到解决方案。 感谢您的帮助。
更新：
这是任何HTML元素真（不只是div）。我只是为这个问题选择一个例子。
您可以在<link>元素引用document集使用<link>元素的.import财产rel属性设置为"import"，也Is there a way to know if a link/script is still pending or has it failed看到，How to append a whole html file with jquery
document.querySelector("link[rel=import][href='template1.html']")
.import.querySelector("#template1")
谢谢，这似乎是一个解决方案，我希望每一个进口包含在一个共同的对象或东西，因为让我说我需要'querySelector'在HTML导入从另一个HTML导入的元素，我需要去通过整个导入树来选择它，这有点麻烦。但是，谢谢 – user544262772
'.import'引用了一个'document'对象。如何编写HTML或其他文档类型留给'document'的作者。 – guest271314
发现的解决方案在这里：https://www.html5rocks.com/en/tutorials/webcomponents/imports/
import.html
<template>
<h1>Hello World!</h1>
<!-- Img is not requested until the <template> goes live. -->
<img src="world.png">
<script>alert("Executed when the template is activated.");</script>
</template>
的index.html
<head>
<link rel="import" href="import.html">
</head>
<body>
<div id="container"></div>
<script>
var link = document.querySelector('link[rel="import"]');
// Clone the <template> in the import.
var template = link.import.querySelector('template');
var clone = document.importNode(template.content, true);
document.querySelector('#container').appendChild(clone);
</script>
</body>
您提到的链接帮助我为我的案例找到合适的解决方案，非常感谢 – user544262772
我对我的问题2个回答不错，他们帮我找到我的具体问题更适合的解决方案，我在这里分享。
我试图实现的是querySelector从主文档的html导入中定义的元素（即index.html）。
如果我们在一个HTML进口根喜欢写东西
<div id="thediv">
...
</div>
，该元素将不会被包含在主文档的主体（我认为每个文档都有自己的命名空间或类似的东西） 。
@ guest271314推荐使用link元素的import属性来访问获取资源的内容，但看到我在同一个岗位评论。我认为在处理导入其他文档时导入其他文档时，这并不是很整洁......
@MaxBillbow推荐使用template提供链接和示例块的相同方法。当您处理关系导入时，这再次不是很好。但链接给了我解决方案。
在我的导入文档，我写的其他脚本：
div.html
<div id="thediv">
...
</div>
<script>
document.body.prepend(
document.currentScript.ownerDocument.querySelector('#thediv'));
</script>
现在，当HTML进口量获取的脚本将得到执行，并在前面加上HTML块到body的主文档。
的index.html
<link rel="import" href="div.html">
<script>
// now I can querySelector('#thediv')
</script>
这只是一个例子，这是一个假的，但我想我将主要使用模板技术，模板是隐藏的，它的确定给他们，预先准备主要文件。
如果您认为该方法可能存在缺陷，请发表评论。
''被覆盖的内容。一旦页面呈现，它不再存在。您需要解决模板的**内容**而不是“”标签本身。 –
@KobyDouek你可以考虑制作答案票吗？我不太清楚这个主意，但我确信这是有趣的信息。谢谢 – user544262772
@KobyDouek我的问题适用于每个html元素（不仅仅是'template'），我只是选择一个例子。 – user544262772