내 문서가 필요합니다. 내 클릭 버튼과 같은 줄에 입력하십시오.

이 테스트 코드를 실행하면 단추 위로 누적 된 날짜가 표시됩니다. 날짜와 버튼을 한 줄로 쓰고 싶습니다. 제발 자바 스크립트가있는 첫 번째 테스트 코드라는 것을 명심하십시오.내 문서가 필요합니다. 내 클릭 버튼과 같은 줄에 입력하십시오.

<html> 

<head> 
<script type="text/javascript"> 
<!-- 
var currentTime = new Date() 
var month = currentTime.getMonth() + 1 
var day = currentTime.getDate() 
var year = currentTime.getFullYear() 
document.write("Today's Date" + month + "/" + day + "/" + year) 
//--> 

</script> 
</head> 
<body> 

<form name=myform> 
<input type=button value="add days" onClick="prompt('How many days do you want to add?','5 or 6');"> 
</form> 


</body> 
</html>

출처

2012-05-20 user1324518

http://stackoverflow.com/questions/802854/why-is-document-write-considered-a-bad-practice – mpm

Don't use document.write. 대신, 더 적절한 방법은 페이지의 요소를 사용하는 것입니다 :

<script type="text/javascript"> 
    // Build your variables and message 
    var currentTime = new Date(); 
    var month = currentTime.getMonth() + 1; 
    var day = currentTime.getDate(); 
    var year = currentTime.getFullYear(); 
    var msg = document.createTextNode("Date: "+month+"/"+day+"/"+year); 

    // When the body has loaded, set our message 
    document.body.onload = function(){ 
     document.getElementById("todaysDate").appendChild(msg); 
    }; 
</script>

출처

2012-05-20 02:02:45 Sampson

최고 음,'innerHTML'도 다소 찌푸리게 – user1324518

당신의 도움을 주셔서 감사합니다 에, 유효하지 않기 때문에 – Hawken

@Hawken Correct. 일관성을 위해 내 대답을 업데이트했습니다. 내가 실수하지 않는다면, 'innerHTML'은 * 값을 얻는 것에 대해 눈살을 찌푸리게되고 * 값을 설정하는 것은 아닙니다. 내가 틀렸을 수도있다. – Sampson

:이 시점에서

<form name="myForm"> 
    <span id="todaysDate"></span> 
    <input type="button" /> 
</form>

, 당신은 "todaysDate"의 ID로 요소에 날짜 값을 할당 할 수 있습니다

조나단 말이 맞습니다. document.write를 테스트하거나 뭔가를 사용하지 않는 이상 document.write는 결코 최상의 솔루션이 아닙니다.

당신이 처음 경험의 중첩이 대신

<html> 

     <head> 
     <script type="text/javascript"> 
      var currentTime = new Date(); 
      var month = currentTime.getMonth() + 1; 
      var day = currentTime.getDate(); 
      var year = currentTime.getFullYear(); 
      var dateString = "Today's Date " + month + "/" + day + "/" + year; 
      function loadDate(){ 
      document.getElementById('dateSpan').innerHTML = dateString; 
      } 
     </script> 

     </head> 
     <body onload='loadDate()'> 
     <form name=myform> 
      <span id='dateSpan'></span><input type=button value="add days" onclick="promptprompt('How many days do you want to add?','5 or 6')"/> 
     </form> 
     </body> 
    </html>

출처

2012-05-20 02:13:37 dano

하하 그가 나를 이겼다. – dano

이유는 날짜의 상단에있는 버튼 위에 있지만, 다른 방법으로 주위의 날짜 문자열 땅이 (버튼 땅 아니다 할 끈). 전혀 사용하지 않으면 document.write()는 < 본문 >의 출력이 HTML과 같은 정확한 위치에 있어야합니다. < 머리 >에 배치하는 것은 의미가 없습니다. 귀하의 브라우저는 혼란스럽고 어쨌든 즉시 실행하려고 시도합니다. 그러나은 레이아웃을 업데이트하지 않으므로 (나중에 초기화되지 않은 것 같습니다) 나중에 < 본체의 첫 번째 내용 > (버튼 일 수 있습니다) 오버레이.

다음은 OLD STYLE처럼 보일 것입니다. 이 코드는 이 아니며은 현재 모범 사례 코딩 표준과 일치하며 이 아니고이 정확히 에뮬레이트되어야합니다. 그러나 "실제로"무슨 일이 일어나고 있는지 더 잘 알 수 있습니다. Do this는 "innerHTML"을 사용하지 않고 양식을 초기화하는 방법을 보여줍니다. 또한 양식 필드에 레이블을 지정하는 방법을 설명합니다.

여기에 "document.write"를 사용하면 안된다는 데 동의합니다. 지나치게 유연하지 못합니다 (페이지를 서버에서 가져 왔을 때 항상 실행되지만 사용자가 "뒤로"버튼을 클릭 할 때 실행되지 않고 "재설정 양식"과 같은 다른 용도로 사용하기 위해 Javascript 프로그램에서 사용할 수 없음). 또한 많은 경우 실제로 성능이 저하됩니다.

양식의 모든 입력란을 정렬하여 "예쁘"며 전체 양식 주위에 상자를 그리는 것이 일반적입니다. 그런 일은하기 쉽습니다. 그러나 질문의 영역에 초점을 맞추기 위해이 예에서는 이 아니고이 그 예를 보여줍니다.

getElementById()를 사용하지 않고 양식 내에서 필드 이름을 지정하고 일부 브라우저 특정 배열 mumbo-jumbo를 사용하여 액세스하는 것은 가능했습니다 (일반적으로). 그러나 getElementById()를 사용하는 방법은 훨씬 간단하며 모든 브라우저에서 작동합니다. 어떻게 사용했는지 설명하지는 못합니다.

window.onload = (함수 이름이 이 아니라이 아니라 괄호 안에 인수 목록이 있음)는 더 이상 올바른 방법이 아닙니다. 나는 매우 짧고 단순하기 때문에 그것을 사용했습니다. 독자가 정말로 중요한 것에 집중할 수있게 해줍니다.

<html> 
<head> 
<title>Example of setting a Form Input field</title> 
<script type="text/javascript"> 
function showDefaultDate() { 
     var dateInputField = document.getElementById("dateInputField"); 
     dateInputField.value = provideToday(); 
} 

function provideToday() { 
     var currentTime = new Date(); 
     var month = currentTime.getMonth() + 1; 
     var day = currentTime.getDate(); 
     var year = currentTime.getFullYear(); 
     var dateString = month + "/" + day + "/" + year; 
     return dateString; 
} 

function initializeForm() { 
     showDefaultDate(); 
} 

window.onload = initializeForm; 
</script> 
</head> 
<body> 
<form> 
Today's Date: 
<input type="text" size=" 25" id="dateInputField"> 
<input type="button" value="Miscellaneous Button"> 
<br> 
Another Field: 
<input type="text" size="30"> 
<br> 
<br> 
<input type="submit" value="Click Me When Done" style="margin-left: 20ex;"> 
</form> 
</body> 
</html>

출처

2012-05-20 03:52:36

내 문서가 필요합니다. 내 클릭 버튼과 같은 줄에 입력하십시오.

답변

관련 문제