JavaScript - document.write not working

질문의 ID를 가진 h3을 인쇄하려고하는데 작동하지 않습니다. JavaScript - document.write not working

function questions() { 
 
    var question = document.getElementById("question"); 
 
    document.write(question); 
 
} 
 

 
questions();

body { 
 
    font-family: Arial; 
 
} 
 

 
.header { 
 
    padding-top: 50px; 
 
    text-align: center; 
 
}

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Document</title> 
 
    <link rel="stylesheet" href="styles.css"> 
 
</head> 
 

 
<body> 
 
    <div class="header"> 
 
    <h1>Edu Game 1</h1> 
 
    <h3>What is<h3 id="question">1+1?</h3></h3> 
 
    <input type = "text" id="ansBox" /> 
 
    </div> 
 

 
    <script src="scripts.js"></script> 
 
</body> 
 
</html>

당신이 볼 수 있듯이 그것은 자바 스크립트에 도달 할 때까지, 결과가 괜찮

. 이 문제를 어떻게 해결할 수 있습니까? document.write는 물건을 인쇄 할 때 가장 좋은 방법이 아니라는 것을 압니다.

출처

2016-08-25 Anonymous

와우. 너는 나랑 같은 이름이야. 우리는 관련이 있습니까? –

'document.getElementById ("question")'가 돌아오고 당신은 무엇을 표시하기를 희망합니까? 'document.write'는 거의 올바른 방법이 아닙니다. – j08691

h3의 텍스트 인 1 + 1을 인쇄하고 싶습니다. –

document.getElementById("question")은 DOM 객체를 반환하고 그 안에있는 HTML에 액세스하므로 innerHTML 속성을 사용하여 document.getElementById("question").innerHTML으로 가져옵니다. 따라서 기술적으로 아무런 문제가 없습니다. document.write; 그것은 그 일을하고 있습니다. 요소의 내용을 선택하지 않았습니다.

function questions() { 
 
    var question = document.getElementById("question").innerHTML; 
 
    document.write(question); 
 
} 
 

 
questions();

body { 
 
    font-family: Arial; 
 
} 
 

 
.header { 
 
    padding-top: 50px; 
 
    text-align: center; 
 
}

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Document</title> 
 
    <link rel="stylesheet" href="styles.css"> 
 
</head> 
 

 
<body> 
 
    <div class="header"> 
 
    <h1>Edu Game 1</h1> 
 
    <h3>What is<h3 id="question">1+1?</h3></h3> 
 
    <input type = "text" id="ansBox" /> 
 
    </div> 
 

 
    <script src="scripts.js"></script> 
 
</body> 
 
</html>

출처

2016-08-25 20:50:26 j08691

질문 유형 HTMLHeadingElement의 개체입니다. 해당 객체의 문자열 표현을 쓰고 있습니다. [object HTMLHeadingElement]입니다.

해당 요소 (question.outerHTML) 또는 그 내용 (question.innerHTML)을 생성하는 데 사용 된 원시 HTML에 관심이 있습니다.

출처

2016-08-25 20:52:22

여기에 스크립트를 배치하여로드 DOM의 콘텐츠를 기다리고보십시오 :

document.addEventListener("DOMContentLoaded", function() { 
    // code... 
});

이 innerHTML

또한 var question = document.getElementById("question").innerHTML;

와 question을 설정, 둥지에게 태그를 해달라고 대신 범위를 사용합니다 :

<h3>What is<span id="question">1+1?</span></h3>

출처

2016-08-25 20:55:04

페이지에 HTMLheading 개체를 쓰려고합니다. 이 작업을 수행하려면 .outerHTML 속성을 사용하십시오.

function questions() { 
 
    var question = document.getElementById("question").outerHTML; 
 
    document.write(question); 
 
} 
 

 
questions();

body { 
 
    font-family: Arial; 
 
} 
 

 
.header { 
 
    padding-top: 50px; 
 
    text-align: center; 
 
}

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Document</title> 
 
    <link rel="stylesheet" href="styles.css"> 
 
</head> 
 

 
<body> 
 
    <div class="header"> 
 
    <h1>Edu Game 1</h1> 
 
    <h3>What is<h3 id="question">1+1?</h3></h3> 
 
    <input type = "text" id="ansBox" /> 
 
    </div> 
 

 
    <script src="scripts.js"></script> 
 
</body> 
 
</html>

출처

2016-08-25 20:56:49

JavaScript - document.write not working

답변

관련 문제