2013-02-08 1 views
0

저는 자바 초보자이며 왜 무언가가 작동하지 않는지 이해하려고합니다. 나는 다음 <body>에 액세스 할 수있는 <head> 섹션의 일부 참조 배열 간단한 페이지를 만들어 그래서 머리 부분은 다음과 같습니다<body>의 자바 스크립트 코드는 <head>에 배열을 액세스 할 수 없습니다.

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

(가) 내가 몸에 드롭 다운을 구동하기 위해이 배열을 사용하려면

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

내가이 합리적 일 것이라고 생각하고 그것은 내가 온라인으로 볼 예제를 기반으로 한 다음 HTML의 그래서 내가이 사용하는 거라고 생각했다. 그러나 배열이 비어있는 것처럼 보이는 것처럼 빈 드롭 다운이 생성됩니다. 내가 잘못 이해했거나 잘못한 것은 무엇입니까?

+1

짧은 답변에서 확인해보기 : 몸에 넣어하지 않습니다. – David

+0

또한 글로벌 시티가 아닌'global_cities'가 필요하다고 생각합니다. –

+0

'script' 태그는 일반적으로 문서의 '' 태그 또는 body 태그의 끝에 있습니다. –

답변

3

구문이 잘못되었습니다. JavaScript에는 global이라는 키워드가 없습니다.

변경

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

에 대한 귀하의 구문은 당신에게 콘솔의 오류를 제공해야합니다!

함수 범위 내에 정의되지 않은 변수는 브라우저 환경의 전역 범위 인 window 개체에 자동으로 추가됩니다. 따라서 global 키워드와 같은 것을 정의 할 필요가 없습니다.

기타 사항 : 전역 변수를 정의

  • 은 나쁜 관행으로 간주됩니다. 여러 스크립트를로드 할 때 변수 충돌이 발생할 수 있습니다.
  • document.write은 일반적으로 좋지 않습니다. 페이지에서 동적 콘텐츠를 얻으려면 innerHTML과 같은 것을 사용하십시오.
+0

확인. 나는 세계를 떨어 뜨 렸지만 도움이되지 못했다. –

+1

@ Component10 [이 피들]에서 잘 작동합니다 (http://jsfiddle.net/uw8kN/). – Sirko

+0

도움 주셔서 감사합니다. Javascript 콘솔을 작동시키는 방법을 알아 냈고 배열이 제대로 정의되지 못하게하는 관련이없는 구문 오류가 있음을 발견했습니다. 귀하의 제안에 감사드립니다. –

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> 

을보십시오.

1

어디서부터 ... 먼저 닫는 body 태그 바로 전에 문서의 맨 아래에 자바 스크립트를 넣는 것이 좋습니다. 즉 이유에 대한 설명은 다음 링크를 참조 : 문서의 하단에 자바 스크립트 파일을 포함 할 때

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

당신은 다른 이벤트에 이러한 기능을 함수로 코드를 묶고 결합 강요 당할 것이다 . 자바 스크립트는 이벤트 중심 언어입니다.

이렇게하면 프로젝트 전체에서 재사용 할 수있는 코드를 작성하는 것이 좋습니다. 나는 좋은 코드를 작성하는 것에 대해 큰 강의를하지는 않겠지 만, 시작하기에 좋은 책을 선택하는 것이 좋습니다. 같은 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.

관련 문제