為什么這段代碼不輸出任何內容？

Question

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>

    <script language="javascript" type="text/javascript" >
        var per1 = { name: "john", age: 23 }; 
        var per2 = { name: "Robin", age: 10 };
        var per3 = { name: "temp", age: 15 };

        var people = new Array(3);
        people[0] = per1;
        people[1] = per2;
        people[2] = per3;

        function select()
        {
            document.write("test");
            for(var i=0; i<people.length; i++)
            {
                if (people[i].age < 20)
                    document.write(people[i].name + "<br/>");
            }

        }

    </script>

    <header id="temp">temp</header>
    <input type="button" value="touch me" onclick="select()" />

</body>
</html>

我對javascript完全陌生。 這是我寫的代碼。 我找不到這段代碼有什么問題。 有人可以幫忙嗎？ 謝謝。 問題是當我單擊按鈕時，什么也沒發生。

Answer 1

為什么這段代碼不輸出任何內容？

由於您的函數名稱與window對象的select方法沖突，因為全局函數被拋出到window 。 如果您將函數名稱更改為其他名稱（例如foo ），它將起作用，因為您將頁面替換為單詞"test" （至少）。

這是您的代碼的實時副本，該副本不起作用，這是一個將函數名稱更改為foo 的副本。

這是避免使用全局變量的眾多原因之一。 例如，在這種情況下，您可以為您的按鈕指定一個id （ id="theButton" ）而不提供onclick ，然后使用此經過最小修改的腳本：

(function() {
  var per1 = { name: "john", age: 23 }; 
  var per2 = { name: "Robin", age: 10 };
  var per3 = { name: "temp", age: 15 };

  var people = new Array(3);
  people[0] = per1;
  people[1] = per2;
  people[2] = per3;

  document.getElementById("theButton").onclick = select;

  function select()
  {
      document.write("test");
      for(var i=0; i<people.length; i++)
      {
          if (people[i].age < 20)
              document.write(people[i].name + "<br/>");
      }
  }
})();

之所以select是因為select不再是全局的，因此不再發生沖突。

僅僅為了它的價值，這是一個不使用document.write 的版本（最好避免使用），使用代碼連接處理程序，並使用數組文字符號：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <header id="temp">temp</header>
    <input type="button" value="touch me" id="theButton" />
    <!-- Note that the script is *below* the content it uses -->
    <script language="javascript" type="text/javascript" >
    (function(){
        var people = [
            { name: "john", age: 23 },
            { name: "Robin", age: 10 },
            { name: "temp", age: 15 }
        ];

        document.getElementById("theButton").onclick = run;

        function run()
        {
            display("test");
            for(var i=0; i<people.length; i++)
            {
                if (people[i].age < 20)
                {
                    display(people[i].name);
                }
            }
        }

        function display(msg) {
            var p = document.createElement('p');
            p.innerHTML = String(msg);
            document.body.appendChild(p);
        }
    })();
    </script>
</body>
</html>

為什么這段代碼不輸出任何內容？

問題描述

1 個解決方案

解決方案1
7 已采納 2014-05-19 16:50:37

為什么這段代碼不輸出任何內容？

問題描述

1 個解決方案

解決方案1 7 已采納 2014-05-19 16:50:37

解決方案1
7 已采納 2014-05-19 16:50:37