JavaScriptを使用してDOMに画像を追加する方法

プログラムで画像を追加する必要がありましたDOMつまり、動的にHTMLページに変換します。

そのために、私はimgを使用する要素createElementDocumentオブジェクトのメソッド:

const image = document.createElement('img')

それから私はsrc画像の属性:

image.src  = '/picture.png'

(通常のHTMLで使用するのと同じように、相対URLまたは絶対URLを使用できます。img鬼ごっこ)

次に、画像を追加したいコンテナを特定し、appendChild()その上の方法:

document.querySelector('.container').appendChild(image)

私の無料ダウンロードJavaScriptビギナーズハンドブック


その他のブラウザチュートリアル: