DOBON.NETプログラミング道掲示板

HOME HELP 新規作成 新着記事 ツリー表示 スレッド表示 トピック表示 発言ランク ファイル一覧 検索 過去ログ

■35417 / 1階層) 　style.displayだと効率悪いから違うやり方をしたいです。
□投稿者/ 魔界の仮面弁士 大御所(1544回)-(2023/05/11(Thu) 13:27:36)
  • アイコン2023/05/11(Thu) 13:31:57 編集(投稿者)

    ■No35416に返信(えっぴーさんの記事)
    > style.displayだと効率悪いから違うやり方をしたいです。
    そもそもなぜ、style を直接操作したいのでしょうか。
    基本的には css クラスで操作する設計にするべきだと思いますが…。
    https://ja.javascript.info/styles-and-classes

    CSS や JS 向けのフレームワークを使うにせよ使わないにせよ、
    広域的操作であれば class / className で調整した方が便利かと。


    > セレクトごとに、
    > document.getElementById('Box1').style.display = "";と、
    > document.getElementById('Box1').style.display = "none";
    > を書かなければならないからです。
    短縮表記だけの話なら、
    　const $id = document.getElementById;
    みたいにエイリアスを用意して、
    　$id('box1').style.display = 'none';
    などとは書けますね。

    あるいは CSSStyleDeclaration オブジェクト自体をキャッシュした
    　let boxStyle = document.getElementById('Box1').style;
    などを用意しておけば、以降は
    　boxStyle.display = 'none';
    と書くことはできますが…いずれにせよ、style は積極的に使うべきでなく、
    基本的には CSS クラスで制御するようにし、それで処理しきれない要素に
    限定して、style の直接操作を試みた方が良いでしょう。


    > しかし、document.getElementById自体1つしか書けないのです。
    document.querySelector
    document.querySelectorAll
    を使わないのは何故ですか? (CSS セレクター指定)
    https://developer.mozilla.org/ja/docs/Web/CSS/CSS_Selectors
違反を報告
削除キー/

前の記事(元になった記事) 次の記事(この記事の返信)
←style.displayだと効率悪いから違うやり方をしたいです。 /えっぴー →Re[2]: style.displayだと効率悪いから違うやり方をしたいです。 /えっぴー
　
上記関連ツリー

Nomalアイコン style.displayだと効率悪いから違うやり方をしたいです。 / えっぴー (23/05/11(Thu) 13:00) #35416
└Nomalアイコン style.displayだと効率悪いから違うやり方をしたいです。 / 魔界の仮面弁士 (23/05/11(Thu) 13:27) #35417 ←Now
  └Nomalアイコン Re[2]: style.displayだと効率悪いから違うやり方をしたいです。 / えっぴー (23/05/11(Thu) 14:00) #35418
    └Nomalアイコン Re[3]: style.displayだと効率悪いから違うやり方をしたいです。 / 福ちゃん (23/05/11(Thu) 17:34) #35419 解決済み!
      ├Nomalアイコン Re[4]: style.displayだと効率悪いから違うやり方をしたいです。 / 魔界の仮面弁士 (23/05/11(Thu) 18:32) #35420
      └Nomalアイコン 【注意】ルールをお守りください / 管理人 (23/05/12(Fri) 03:16) #35421

All 上記ツリーを一括表示 / 上記ツリーをトピック表示
　
上記の記事へ返信
Mode/　 Pass/

HOME HELP 新規作成 新着記事 ツリー表示 スレッド表示 トピック表示 発言ランク ファイル一覧 検索 過去ログ

- Child Tree -