Javascriptが：私はJavaScriptに新しいんだけど、私はこのコード行で、「予期しないトークンILLEGAL」エラーを取得しています

Question

のappendChild（）で予期しないトークンILLEGALエラー：

switch (city) { 
    case "london": 
     var newdiv = document.createElement('<div id="london" class="option-area"><label class="city">From London to…?</label> 
       <select class="city"> 
        <option></option> 
        <option>1</option> 
        <option>2</option> 
        <option>3</option> 
       </select><br /></div>'); 

     document.all.bookingform.appendChild(newdiv); 
     break; 
} 

それはおそらく非常にダムです間違いですが、私はこのブロックを動作させるために数時間試しました。助けてください！

Answer 1

あなたのコード内のカップルのエラーがありますし、後でそれのためのHTMLを変更する、要素を作成することができます。

1）document.createElement() functionは、要素名ではなく、HTML/XMLのような単一の引数を取りますスニペットを使用してDOMツリーを解析してビルドします。しかし、あなたは、たとえば、匿名のラッパー要素を構築し、その内側のHTMLを設定し、ターゲット要素にその最初の子を追加することで、あなたの目標を達成chould：

var wrapperDiv = document.createElement("div"); 
wrapperDiv.innerHTML = '<div id="london" class="option-area"><label...'; 
document.all.bookingform.appendChild(wrapperDiv.firstChild); 

2）文字列は複数行にまたがることはできませんが、あなたが構築することができますこのように複数行の文字列：

var str = '<div id="london" class="option-area">' + 
      ' <label class="city">From London to…?</label>' + 
      ' <select class="city">' + // ... 
      '</div>'; 

あなたが実際にあなたが'Hello\nnewline!'のように、文字列リテラルで改行エスケープシーケンス（\n）を使用することができ、文字列中に改行をしたい場合。

[編集]もちろん

、あなたはちょうどあなたがこれを行う文書本体内にすでに要素にHTMLを追加しようとしている場合：しかし癖があること

var mydiv = document.getElementById('mydiv'); 
if (mydiv) { 
    mydiv.innerHTML += '<div class="newdiv">' + 
        ' New child will be appended...' + 
        '</div>'; 
} 

注意上記のようなフォームを変更するときは、さまざまなブラウザで。 jQuery、ExtJS、Prototype.jsなどのJavaScriptライブラリを使用することを検討してください。

Answer 2

document.createElementは、document.createElement('div')のように1つの要素を作成するために使用されるため、HTMLを渡すことはできません。その後、ref_to_the_div.innerHTML = "<some html="goes here" />"