アクションボタン要素の取得

お世話になっております。

3点質問があり、投稿させていただきました。

アクションボタンの表示位置についての投稿を拝見いたしました。

1、ボタンの要素の取得はクラス名と配列の番号を用いることで可能とのことでしたが、ボタンの要素を、クラス名とタイトルから取得することはできますでしょうか?

 

2、kintone.app.record.getSpaceElement(“フィールドコード”).appendChild(document.getElementsByClassName(“gaia-app-statusbar-actionlist”)[0]);

 では、テキストノードに変換する処理を挟む必要があると思いますが、それでも動きますでしょうか?

 

3、カスタマイズを作ると、アクションボタンの生成がされる前にアクションボタンの要素を読み込もうとしてしまい、結果取得できないのですが、これを回避する方法はありますでしょうか?

 

たくさん質問があり申し訳ありませんが、

一つでもわかる方がいらっしゃれば教えていただきたいです。

よろしくお願いします。

Ai Kanemitsuさん
cstapの瀧ヶ平です。

1つめですが、document.querySelectorを用いてCSSで要素を指定する際と同じようなセレクタを書くことで、要素を取得することは可能です。
例えばアクション名が「申請する」の場合は document.querySelector(“span.gaia-app-statusbar-action-label[title=申請する]”)でアクションボタンのラベル要素が取得できるのでその要素から更に.parentNodeを参照することでアクションボタン要素を取得できます。

2つ目ですが、どの投稿を参照しているかはわかりませんが、テキストノードに変換する処理はどういう意図で必要なのでしょうか?
基本的にはこの操作ではDOM要素が移動するだけなので何ら問題ないかと思います。
あるいは、要素をコピーしたい場合はcloneNode(true)を使えばDOM要素のツリーごとコピーできます、
この際イベントハンドラはコピーされないので、クリックイベントなどをそのまま用いたい場合は別途作り込みが必要です。
また、アクションボタンの名称を取得したいのであればラベル要素のtextContentを参照すればよいかと思います。

3つ目ですが、setTimeout関数を使って遅延処理を行うか、MutationObserverを用いてDOMの更新を監視するような方法があります。
MutationObserverを使う場合以下のようなコードで出来ます。

(new MutationObserver ((mutationRecords, observer) => {
if(document.querySelector("gaia-app-statusbar-action")) {
anyfunc()// 実行したい処理の関数を呼ぶ
observer.disconnect(); // DOMの監視の終了
}
})).observe(document.body, {childList:true, subtree: true});

参考になれば幸いです

ありがとうございます!!

ずっと悩んでいましたが、解決できました。

とても参考になりました!!