JavaScript <html>の上に<!DOCTYPE html>を追加したい

とあらかじめ構成されている要素の<html>の上に<!DOCTYPE html>を追加したいです
下記コードではインスペクターを見ても追加されていませんでした
どのようにしたら追加することができますでしょうか？

<script>
window.onload=function(){
document.html.prepend("<!DOCTYPE html>");
}
</script>

<script>
window.onload=function(){
document.documentElement.prepend("<!DOCTYPE html>");
}
</script>

maisumakun

2021/08/08 04:24

何のためにそれを行いたいのでしょうか？

行動規範の内容に同意します

回答2件

ベストアンサー

DOCTYPE宣言はjavascriptで追加するようなものではありません。
ブラウザ等がhtmlファイルを正しく解釈するためのものです。
javascriptで追加しても全くの無意味です。

他にも

document.htmlというプロパティーは存在しません。
document.documentElementは<html></html>を指しますが、prependは子要素を追加するメソッドです。同じ階層には追加できません。
prependは文字列を指定した場合タグとして解釈はされず、テキストノードとして挿入されます。

投稿2021/08/08 04:26

ka2obushi

総合スコア173

pooi

2021/08/08 05:15

こんにちは回答見ていて気になったのですが、横からよろしいでしょうか？ document.write("<!DOCTYPE html>"); こちらも無意味なんですか？無意味であればそのどういう理由で無意味なのかお聞きしたいです

think49

2021/08/08 05:32

@pooi さん document.write() はDOMをクリアして、DOM構築からやり直すことになる為、document.write() 実行前の状態を復元するには特別なコーディングが必要になります。 document.write() は「Content-Type: application/xhtml+xml」では使えず、可搬性に問題があります(最も、今ではXHTMLはニッチな仕様なので問題視していない人が大半かもしれませんが)。 ※具体的な問題は置いておくとしても、HTML仕様でWarning付きの特殊メソッドである事が大半の人が敬遠する理由だと思います。 https://momdo.github.io/html/dynamic-markup-insertion.html#document.write()

think49

2021/08/08 05:37

> 無意味であればそのどういう理由で無意味なのかお聞きしたいです私としては「無意味」とまではいいませんが、特殊仕様であるがゆえに扱いに注意が必要で、仕様を理解した人にだけ使ってほしいメソッドの扱いです。 eval() の非推奨理由と根本的には同じ認識です。 https://teratail.com/questions/47779#reply-76711

行動規範の内容に同意します

追加すること自体は以下のようなコードで可能です。
しかし、documet.compatMode は変わらないのでやる意味はないでしょう。

js
1const doc = new DOMParser().parseFromString("<!DOCTYPE html>", "text/html");
2console.log('Before-mode: ' + document.compatMode);
3document.insertBefore(doc.firstChild.cloneNode(), document.firstChild);
4console.log('After-mode: ' + document.compatMode);