2016-04-21 9 views
0

私は最初からJavaScriptを理解しようとしています。私のブラウザはbodyタグの中にscriptタグを強制していますか?

私がここでやろうとしているのは、<body>タグにある各要素のnodeTypesを出力することです。私は、出力

3 1 3 1 

は私が<body>タグの外<script>タグを入れて、それはまだforループでカウントされていますいくつかの未知の理由のため<body>の子要素の間に目に見えないテキストがあることを理解しますその結果、3 1 3 1ループシーケンスの最後の桁は1になりました。どうして? <script>タグがブラウザによって<body>タグ内に強制されるのはなぜですか?

<html> 
    <body id = "bodyTest"> 
     <p>Some Text</p> 
    </body> 

    <script type="text/javascript"> 
     var c = document.body.childNodes; 

     var txt = ""; 
     for(var k = 0; k < c.length; k++) { 
      txt += c[k].nodeType + " "; 
      console.log(txt); 
      console.log(c[k].nodeName); 
     } 
     alert(txt); 
    </script> 
</html> 

ここに私が使用しているコードがあります。

<html> 
    <body id = "bodyTest"> 
     <p>Some Text</p> 
    </body> 

    <script type="text/javascript"> 
     // Code above 
    </script> 
</html> 

答えて

7

これは有効なHTMLではありません。 <html>タグは、ではなく、<head>タグと<body>タグのみを含めることができます。

the specificationを参照してください:

許可内容
つのヘッド素子、お使いのブラウザが壊れたHTMLを検出すると、それはそれを修正しようとすると1つの本体要素によって

を追いました。この場合は、<script>タグを<body>のように扱うことを意味します。

+0

感謝を!したがって、htmlタグにはこれらの要素(bodyとhead)しか含めることができません。他のタグはこれらの要素の内側にある必要がありますか?それは素晴らしい情報です。私はあまりにも長い間間違った方法をコーディングしてきたので、私はちょっとしたビットを知ろうとしています。再度、感謝します。 – Wax

+0

@Carnalそれは正しいです。助けてうれしい! –

0

お客様のブラウザでは、<script><html>要素内で有効な最も近い要素の<body>に入力すると、不適切な形式のHTMLが修正されています。

1

html仕様には、ルートhtml要素に含まれる要素がいくつか制限されています。スクリプトはそれらの1つではないので、私たちに示したHTMLは実際には無効です。しかし、ブラウザはソースのほとんどを処理するために最善を尽くします。たとえば、html、head、bodyのないHTMLファイルを作成することができます。ブラウザはbodyタグとhtmlタグに入力をラップすることによってページを表示します。

不可視ノードについて:それらは1つのスペースを持つテキストノードです。この仕様では、空白シーケンスは単一のスペースとして扱われなければならず、要素間の空白(スペース、改行)は引き続きテキストとしてカウントされます。これを試してみて、何が起こるかを参照してください。

<html> 
 
    <body id="bodyTest"> 
 
    <p>Some Text</p><script type="text/javascript"> 
 
     var c = document.body.childNodes; 
 

 
     var txt = ""; 
 
     for(var k = 0; k < c.length; k++) { 
 
      txt += c[k].nodeType + " "; 
 
      console.log(txt); 
 
      console.log(c[k].nodeName); 
 
     } 
 
     alert(txt); 
 
    </script> 
 
    </body> 
 
</html>

関連する問題