0

私はJavascriptの初心者で、何かが機能しない理由を理解しようとしています。セクションにいくつかの参照配列を含む単純なページを作成しました。このページに<head>アクセスできる<body>ので、ヘッドセクションは次のようになります。

<!DOCTYPE html>
<html>
  <head>
    <script>
      var cities = [ "London", "New York" ];
    </script>
  </head>

この配列を使用してHTMLの本文のドロップダウンを駆動したいので、これを使用すると思いました。

<body>
  <select id="dd_city">
    <script>
      for( i = 0; i < cities.length; i++)
      {
        document.write( "<option value=" + i + ">" + cities[i] + "</option>" )
      }
    </script>
  </select>
  ...

これは合理的だと思いました。オンラインで見つけた例に基づいています。ただし、配列が空であるかのように、空のドロップダウンが生成されるだけであることがわかりました。何を誤解したり、間違えたりしましたか？

4

3 に答える 3

3

あなたの構文は間違っています。globalJavaScript にはキーワードがありません。

への変更

<script>
  var cities = [ "London", "New York" ];
</script>

構文でコンソールにエラーが表示されるはずです!

関数スコープ内で定義されていない変数はwindow、ブラウザー環境ではグローバル スコープであるオブジェクトに自動的に追加されます。globalしたがって、キーワードのようなものを定義する必要はありません。

その他の注意事項:

  • グローバル変数を定義することは悪い習慣と見なされます。複数のスクリプトをロードすると、変数の競合が発生する可能性があります。
  • document.write一般的には良い考えではありません。innerHTMLページに動的コンテンツを取得するようなものを使用することをお勧めします。
于 2013-02-08T16:42:32.340 に答える
1

どこから始めればよいか... まず第一に、JavaScript をドキュメントの一番下の body タグの直前に配置することをお勧めします。その理由については、次のリンクを参照してください。

http://developer.yahoo.com/performance/rules.html#js_bottom

ドキュメントの最後に JavaScript ファイルを含めると、コードを関数で囲み、それらの関数を別のイベントにバインドする必要があります。JavaScript は非常にイベント駆動型の言語です。

これにより、プロジェクト全体で再利用可能なより良いコードを書くことができます。良いコードを書くための大きな長い講義には参加しませんが、始めるために良い本を手に取ることをお勧めします。Javascript のようなThe Definitive Guide。

現在持っているコードについては、次のようにします。

<!DOCTYPE html>
<html>
    <head>
    </head>

    <body>
      <select id="dd_city"></select>
      <script>
          var initPage = function() {
              var cities = Array("London", "New York");
              var selectBox = document.getElementById("dd_city");

              for( var i = 0; i < cities.length; i++)
              {
                  var option = document.createElement("option");

                  option.setAttribute("value", i);
                  option.innerHTML = cities[i];
                  selectBox.appendChild(option);
              }
          };

          window.onload = initPage();
      </script>
    </body>
</html>

私のjsfiddleで実際に動作しているのを見てください。

于 2013-02-08T17:29:16.790 に答える
1

都市の前からグローバルを削除し、document.write ではなく document.GetElementById を使用します。また、選択 ID への参照があるため、選択タグ間にスクリプトを含める必要はありません。

試す

<head>
    <script>
        var cities = ["London", "New York"];
    </script>
</head>

<body>
    <select id="dd_city"/>
        <script>
            for (i = 0; i < cities.length; i++) {
                var option = "<option value=" + i + ">" + cities[i] + "</option>";
                document.getElementById("dd_city").innerHTML += option;
            }
        </script>
</body>

また、他の JavaScript スクリプトと競合する可能性があるため、グローバル変数を使用しないことをお勧めします。

于 2013-02-08T16:43:19.267 に答える