javascriptを使用してHTMLリンクをクリックすると、入力フォームを追加するにはどうすればよいですか？

Question

divにリンクが含まれています。クリックすると、リンクは<input type="text">に置き換えられますが、機能しません。

その他のhtmlコードは動作しますが、何らかの理由で、私は入力とのリンクを置き換えることはできません。

function working() { 
 
    document.getElementById("working").innerHTML = "<h1>Test</h1>"; 
 
}; 
 
function notworking() { 
 
    document.getElementById("notworking").innerHTML = "<input type="text">"; 
 
};

<div id="working"> 
 
    <a onclick="working();" href="#">This works!</a> 
 
</div> 
 
<div id="notworking"> 
 
    <a onclick="notworking();" href="#">This doesn't!</a> 
 
</div> 
 
<p> 
 
Notice that the entire code doesn't work unless you comment out the "notworking()" function! 
 
</p>

Answer 1

あなたは、ネストされた引用符のための単一引用符を必要とします。

function notworking() { 
document.getElementById("notworking").innerHTML = "<input type='text'>"; 
} 

私はこれを何度もやったことがあります。二重引用符で囲んで引用符を使用すると、常に一重引用符を使用します。

希望すると助かります！

Answer 2

それがために、この行は次のとおりです。

document.getElementById("notworking").innerHTML = "<input type="text">"; 

あなたは二重引用符で文字列を開始するが、文字列の中に二重引用符を使用しています。これにより、JavaScriptに構文エラーが発生します。文字列の中に二重引用符が必要な場合は、文字列全体を一重引用符で囲みます。逆も同様です。

document.getElementById("notworking").innerHTML = '<input type="text">';

Answer 3

に変更

document.getElementById("notworking").innerHTML = "<input type="text">";

は次のように行います。 text

document.getElementById("notworking").innerHTML = "<input type='text'>";