DOM要素を取得し、onClick機能を変更する方法

開発
1

こんにちは。

setTimeout や querySelector を使用せずに Discourse で DOM 要素を取得する方法について、何かアイデアはありますか？
現在、以下のようなことを行っています。

setTimeout(() => {
    var createTopicButton = document.querySelector("#create-topic");
    if (createTopicButton)
        createTopicButton.onclick = function (e) {
            if (window.Moengage && window.Moengage.track_event) {
                window.Moengage.track_event("Topic_Create_Clicked", {});
            }
            setTimeout(() => {
                var topicCreate = document.querySelector("#reply-control .save-or-cancel .btn-primary")
                topicCreate.onclick = function (e) {
                    let heading = document.querySelector('#reply-control #reply-title').value;
                    let category = document.querySelector('.select-kit-header-wrapper> .select-kit-selected-name > .name > .badge-wrapper > .badge-category > .category-name')?.innerText;
                    let desc = document.querySelector('.d-editor-textarea-column > .d-editor-textarea-wrapper textarea').value;
                    let imagePresent = desc.includes("upload://");
                    if (window.Moengage && window.Moengage.track_event && heading && category && desc) {
                        window.Moengage.track_event("Topic_Created", { "Category": category, "Topic Name": heading, "Topic Description": desc, "Is_image_present": imagePresent });
                    }

                }
            }, [300])

        };
}, [500])

上記のタイムアウトを使用しないと、DOM が完全に読み込まれていないため、window.onload 関数に入れても null 要素を取得することがあります。
したがって、私の目的は DOM 要素を取得し、onChange の機能を変更することです。

何かお手伝いいただけると幸いです。

ありがとうございます :slight_smile:

2

Discourse は完全な EmberJS アプリケーションであるため、サーバーでレンダリングされたプレーンな HTML Web サイトのように要素をクエリ/操作することはできません。

Web アプリをカスタマイズするには、次のガイドラインに従ってください。

Discourse テーマの開発者ガイド

「いいね！」 1
3

開発者ガイドを確認することに加えて、提案された解決策ではなく、何を行おうとしているのかを説明するために一歩立ち止まることもできます。

「いいね！」 1
4

ジェイさん、

ページ上の特定のボタン（いいね、コメント、共有など）をクリックしたときに、moEngage 分析関数を呼び出そうとしていました。

これらのボタンの onClick 機能にアクセスできないと、これは実行できません。Discourse 内にこれを達成するのに役立つプラグインはありますか？

よろしくお願いします。

5

テーマコンポーネントでそれができるはずです。仕組みを理解するために、まずは開発者ガイドから始めることをお勧めします。