html自定義元素的時候報錯(Registration failed for type 'hello'. The type name is invalid)

w3c標準 H5規(guī)范中規(guī)定:自定義元素必須至少包含一個連字符,即最簡形式也要這樣a-b

比如:

<hello></hello>這樣會出錯

<hell-o></hell-o>這樣才對

下邊是demo代碼

index.html:

<!DOCTYPE html >

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<link rel="import" href="demo.html">

<title>html自定義標簽</title>

</head>

<body>

<hell-o></hell-o>

<h1>abc</h1>

</body>

</html>

demo.html:

<!DOCTYPE html >

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>demo</title>

</head>

<body>

<template id="hello">

? ? <style type="text/css">

? ? ? ? h1{color:red;}

? ? </style>

? ? <h1>hello</h1>

</template>

<script type="text/javascript">

? ? var indexDoc=document,

? ? ? ? helloDoc=(indexDoc._currentScript || indexDoc.currentScript).ownerDocument,

? ? ? ? tmpl=helloDoc.querySelector('#hello'),

? ? ? ? HelloProto=Object.create(HTMLElement.prototype);

? ? HelloProto.createdCallback=function(){

? ? ? ? var roots=this.createShadowRoot();? ? ? ?

? ? ? ? roots.appendChild(indexDoc.importNode(tmpl.content,true));

? ? };

? ? var Hello=indexDoc.registerElement('hell-o',{

? ? ? ? prototype:HelloProto

? ? });


</script>

</body>

</html>

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容