サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
Pixel 9
m-kenomemo.com
Javascriptで動的に追加した要素にイベントを設定したい!または追加した要素が存在すればこういった処理をしたい。ってことが時々あります。 その場合、どうやって実装すれば良いか調べたのでメモ。 DOMの変更を監視する「MutationObserver」というAPIを使えばできそうです。 基本の構文 基本的な構文は次の通りとなります。 //オプション const options = { childList: true, //直接の子の変更を監視 characterData: true, //文字の変化を監視 characterDataOldValue: true, //属性の変化前を記録 attributes: true, //属性の変化を監視 subtree: true, //全ての子要素を監視 } //コールバック関数 function callback(mutationsLis
完成したポップアップを確認する(デモ) 動作デモ 実際の動作はこちらで確認できます。遷移先のページでブラウザの「戻る」ボタンをクリックしてください。 ソースコードを確認 ポップアップ表示に必要な部分を抜き出したコードがこちらです。 コード全体 <!DOCTYPE html> <html lang="ja"> <head> <meta id="viewport" name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1" /> <meta charset="UTF-8"> <title>ブラウザバックでポップアップ表示サンプル | えむ家のメモ帳</title> <!-- anonymousCDN --> <link href="<ディレクトリ>/fontawesome/css/all.css"
このページを最初にブックマークしてみませんか?
『m-kenomemo.com』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く