1

タイトルとして、サイトで HTML インポート リンクを使用しました。

<link rel="import" href="http://XX.XX.XX.XX/">
<script type="text/javascript">
    var link = document.querySelector('link[rel="import"]');
var content = link.import;

// Grab DOM from warning.html's document.
var el = content.querySelector('body');
</script>

バリアンス「リンク」は、Chrome ではドキュメントを返しますが、Safari やその他のブラウザーでは null を返します。HTML インポート機能は今のところ Chrome でしかサポートされていないことがわかっているので、インポート リンクの前に次のコードを追加して、Polymer の webcomponents.js をロードします。

<script src="../webcomponentsjs/webcomponents-lite.js"></script>

しかし、他のブラウザではまだ null を返します。修正方法を教えてもらえますか?

4

1 に答える 1

0

<link>リクエストが非同期だからです。

HTMLImportsLoadedイベントをキャッチして、ブラウザによって読み込まれたときにのみファイルを解析します。

<script src="../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="http://XX.XX.XX.XX/XX/warning.html">
<script type="text/javascript">
window.addEventListener( "HTMLImportsLoaded", function () 
{
    var link = document.querySelector('link[rel="import"]');
    var content = link.import;

    // Grab DOM from warning.html's document.
    var el = content.querySelector('body');
} )
</script>
于 2015-10-31T01:22:07.330 に答える