Q&A
> JavaScriptのinnerHTMLはその危険性を指摘され、使うべきではないとはされてますが、
情報元はどこでしょうか？
前提・実現したいこと
JavaScriptのinnerHTMLはその危険性を指摘され、使うべきではないとはされてますが、
該当のソースコードの場合、innerHTMLを使わずどう動かすべきなんでしょうか
該当のソースコード
JavaScript
1<script> 2window.onload=function(){ 3a.innerHTML="<b>test</b><s>test</s><i>test</i>"; 4//↑こういう処理を数百行に渡り処理したい場合 5//単純に書いてますが複雑な場合 6} 7</script> 8<div id="a"></div>
ウェブコンソールからJavaScriptを実行した場合に、innerHTMLの部分を書き換えられてスクリプト等使われかねない、ということではないんですか？
回答3件
0
具体的にどうしたいか分からないですが、文字列としてHTML入れるんじゃなく、elementを作ってappendとかでしょうか。
Document.createElement()
Node.appendChild
Node.textContent
ただ、どのような記事を見たのか知らないですが、私は普通にinnerHTML使います。
投稿2020/06/27 00:09
総合スコア80875
例えば、何千行とある場合に、
全てappendするんでしょうか？
> 例えば、何千行とある場合に、
全てappendするんでしょうか？
現代であれば、「<template>要素でHTML側に用意しておく」あるいは「適当なVDOM系ライブラリを使う」など、別な手段があります。生DOMで何千行ものHTMLと格闘する、ということ自体が、多くの場合に適切な選択肢ではありません。
何千行って具体的に何ですか？
なんの法則性もないのでしょうか。
ないなら法則性作れば良い話ですし、maisumakunさんが仰るように、幾らでも別の手段をとれます。
0
JavaScriptのinnerHTMLはその危険性を指摘され、使うべきではないとはされてますが、
WISYWIGエディタが登場して間もない頃の ユーザの（フォーム）入力をそのまま innerHTML に代入する悪例 に限っての話でしょう。
使っちゃいけないなんてことはありません。
ソース：https://html5experts.jp/yoshikawa_t/1888/
HTML4時代のjQuery（v1 ~ 2）が使われていた頃には、ブラウザ挙動に対する処理速度を理由に「DOM操作を使え」と言われる時代もありました。
追記）
多彩な表現を行う jQuery プラグインはソースコードを覗き見ると HTML がハードコードされており、実質 innerHTML を使うものも多かったように思います。ご質問のコードもそれに似た ハードコードされた状態です。
innerHTMLを使わずどう動かすべきなんでしょうか
- 文書断片を作って、ツリーを構築する。
- 表示を変えたい場所に、1.で作ったツリーを挿し込む。
私は DOM操作する際は、文書断片 を意識するようにしています。
投稿2020/06/27 00:20
編集2020/06/27 00:35
総合スコア5434
0
ベストアンサー
ウェブコンソールからJavaScriptを実行した場合に、innerHTMLの部分を書き換えられてスクリプト等使われかねない、ということではないんですか？
ブラウザに表示されるHTMLやJavaScriptの、コンソールからの書き換えはどんなページに対しても行えます。とはいえ、それは表示者自身にしか影響しないので、JavaScriptで重要な値を生成するようなことをしていない限り気にする必要はありません。
投稿2020/06/27 01:53
編集2020/06/27 01:55総合スコア146018
あなたの回答
tips
プレビュー
