2

javascriptは初めてですが、次のコード行で「予期しないトークンの不正」エラーが発生します。

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;
}

それはおそらく非常にばかげた間違いですが、私はこのブロックを機能させるために何時間も試みました。助けてください!

4

2 に答える 2

5

コードにいくつかのエラーがあります。

1)このdocument.createElement()関数は、DOMツリーを解析および構築するためのHTML / XMLスニペットではなく、要素名として単一の引数を取ります。ただし、匿名のラッパー要素を作成し、その内部HTMLを設定してから、最初の子をターゲット要素に追加することで、目標を達成する必要があります。次に例を示します。

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>';

\n文字列に実際に改行が必要な場合は、。のように文字列リテラルで改行エスケープシーケンス()を使用できます'Hello\nnewline!'

[編集]

もちろん、すでにドキュメント本体にある要素にHTMLを追加しようとしている場合は、次のようにします。

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

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

于 2011-09-17T19:22:00.573 に答える
2

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

于 2011-09-17T19:20:39.360 に答える