在我的index.html中,我使用Template,Shadow DOM等導入外部HTML文件。自定義Web組件。HTMl導入自己的WebComponent
// index.html的
...
<script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.3.4/platform.js"></script>
<link rel="import" href="/html-components/userlogin-header.html" >
<head>
<body>
<userlogin-header username="Test User"userimage="http://domain.com/img.jpg"></userlogin-header>
...
而其他文件用戶登陸-了header.html:
// USERLOGIN-header.html中
<template id="userlogin-header">
<div class="imgbox">
<img src="" class="userimage">
</div>
<div class="userinfo">
<div class="name"><span class="username"></div>
</div>
</template>
<script>
var doc = this.document.currentScript.ownerDocument,
UserLoginProto = Object.create(HTMLElement.prototype);
UserLoginProto.createdCallback = function() {
var template = doc.querySelector("#userlogin-header"),
box = template.content.cloneNode(true);
this.shadow = this.createShadowRoot();
this.shadow.appendChild(box);
var username = this.shadow.querySelector('.userinfo .username');
username.innerHTML = (this.getAttribute('username') || 'Unbekannt');
var imageurl = this.shadow.querySelector('img.userimage');
imageurl.src = 'https://secure.gravatar.com/avatar/' + this.getAttribute('userimage') + '1?s=40&d=http://s3-01.webmart.de/web/support_user.png';
};
var Xuserlogin = doc.registerElement('userlogin-header', { 'prototype' : UserLoginProto });
</script>
的問題是,有通話時出現以下錯誤index.html
Uncaught TypeError: Cannot read property 'content' of null
如果我在我的Chrome中啓用HTML導入,那麼一切正常。但後來我禁用了這個,並使用platform.js,而不是這個錯誤。
有沒有解決這個問題的方法?我不想使用整個聚合物框架。
platform.js是您的'
'中第一個包含的文件嗎? – CletusW是的,這是第一個包含在