HTML要素をtelegra.ph P要素に追加するにはどうすればよいですか?

Question

Chrome 拡張機能を構築していて、この電報ページにいくつかの要素を追加したいのですが、HTML 全体ではなくテキストのみが正常に追加されているようです。

const スパン = document.createElement("スパン");
span.innerHTML = '<span class="xxx">Foo,bar</span>';
const p = document.querySelector("p");
p.appendChild(スパン);

Answer 1

コメントで示唆されているように、コードがドキュメント ツリー dom の特定の点で何かを変更しようとしたときにリアルタイムで変更される MutationObserver が実際に存在することを私自身で確認しました。

オブジェクトを保持する変数がどのスコープにあるかを懸命に見つけない限り、dom 上でリッスンしているライブ MutationObservers インスタンス (存在する場合) を見つける標準的な方法はないため、最も早い方法は本体を次のように置き換えることです。 it 要素のクローンでは、すべての MutationObserver が消えます。

document.body = document.body.cloneNode(true);

これを完了すると、要素を dom に接続しようとすると、干渉することなくそれに応じて変更されます。

＃＃＃公平であるために...＃＃＃

ライブ MutationObserver インスタンスを取得する方法、またはこの要件を解決する有効な方法を探しているときに、Stack Overflow の回答で最後の手がかりを見つけましたか?

すべての mutationObservers を参照せずにプロジェクトから削除する方法はありますか?