kintone.mobile.app.getHeaderSpaceElement()の位置を固定する方法

kintone カスタマイズ
1

下記を利用して、スマホ画面のヘッダ部分にボタンをfixedで固定で置きたいのですが、

kintone.mobile.app.getHeaderSpaceElement().appendChild(contactUpdateFieldButton);

 

下記のようなコードでは、エラーとなってしまいます。どのようにすれば良いのでしょうか？

        var gaiaMobileScrollablecontroller = document.getElementsByClassName('gaia-mobile-scrollablecontroller');
        gaiaMobileScrollablecontroller.style.position = 'relative';

        
        var kintoneMobileAppHeaderSpace = document.getElementsByClassName('kintone-mobile-app-header-space');
        kintoneMobileAppHeaderSpace.style.position = 'fixed';
        kintoneMobileAppHeaderSpace.style.top = '100';
        kintoneMobileAppHeaderSpace.style.left = '0';
        kintoneMobileAppHeaderSpace.style.zIndex = '5';

エラー内容は下記のとおりです。

edit.js:525 Uncaught TypeError: Cannot set property 'position' of undefined
2

渡邊さん

getElementsByClassName関数は、引数に与えたクラス名に一致する要素全ての集合になっている配列のようなオブジェクト(NodeListという組み込みクラスのインスタンスになっています)を返します。(便宜上配列と同列に考えて構いません)

そのためgaiaMobileScrollablecontroller変数は単一の要素ではなく複数の要素の配列なので、末尾に目的の要素と一致する添字をつけてアクセスする必要があります

3

 瀧ヶ平様

ご回答ありがとうございます！

他ではできていたのに、今までと違うことをしたので、気づいていませんでした。

また、先ほどのご回答により、

無駄なコードがバッサリ消えました！

たびたび、ありがとうございます。