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>

あなたが見ることができるように、それはJavaScriptを達するまで、結果は大丈夫です。これをどうすれば解決できますか？私は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... 
});

設定questioninnerHTMLまた

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

で、巣にタグをいけない、代わりにスパンを使用します。

<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

答えて

関連する問題