appendChild、insertAdjacentHTML、の違いを知りたいですinnerHTML。
機能は似ていると思いますが、実行速度ではなく使い方で明確に理解したいです。
innerHTML、新しいタグまたはテキストを HTML の別のタグに挿入するために使用できますが、追加するのではなく、そのタグの現在のコンテンツを置き換えます。そのように（置換ではなく）insertAdjacentHTMLやりたい場合は、使用する必要があり、新しい要素を挿入する場所を管理できます（beforebegin、afterbegin、beforeend、afterend）
最後に、(現在のタグに挿入するのではなく) 新しいタグを作成して HTML に挿入する場合は、appendChild.
私はそれを正しく理解していますか？それとも、これら3つの違いはありますか？
MDN から:
innerHTML は、要素の子孫を記述する HTML 構文を設定または取得します。
に書き込むとinnerHTML、ソース要素のコンテンツが上書きされます。つまり、HTML をロードして再解析する必要があります。これは、特に内部ループを使用する場合にはあまり効率的ではありません。
MDN から:
指定された親ノードの子のリストの最後にノードを追加します。ノードが既に存在する場合は、現在の親ノードから削除され、新しい親ノードに追加されます。
このメソッドはすべてのブラウザーでサポートされており、ノード、テキスト、データなどを DOM に挿入するためのよりクリーンな方法です。
MDN から:
指定されたテキストを HTML または XML として解析し、結果のノードを DOM ツリーの指定された位置に挿入します。[ ... ]
この方法は、すべてのブラウザーでもサポートされています。
....
メソッドはappendChild要素を DOM に追加します。
innerHTMLプロパティとメソッドはinsertAdjacentHTML要素ではなく文字列を取るため、DOM に配置する前に、文字列を解析してそこから要素を作成する必要があります。
innerHTMLプロパティは、要素のコンテンツの HTML コードの取得と設定の両方に使用できます。