入れ子の末端のタグにクラスを付与

篠原 隆司

アフィリエイト広告を利用しています

このページの内容が役に立ったら X (旧twitter) でフォローして頂けると励みになります
挨拶や報告は無しで大丈夫です

<ul> を入れ子にしていったとき、末端だけを装飾したくなったので作りました。

(function(){
    'use strict';

    // HTMLの読み込みと解析が完了したとき発動、css、画像、iframeなどを待たない
    document.addEventListener('DOMContentLoaded', (event) => {

        // セレクタを指定して走査
        document.querySelectorAll('.sample-list ul li')
        .forEach((li) => {

            // 子孫に LI を持っていなければ
            if (li.getElementsByTagName('li').length === 0) {

                // LI にクラスを付与
                li.classList.add('end-item');
            }
        });
    });
})();

メニューとか目次で使用できそうですね。

開発・技術入サポート

ということで宣伝です。

弊社ではライブラリなどを使わない生のJavascriptを扱うこともできますので、お気軽にお問い合わせください。
Javascript は2005年頃から触り続けてきていることもあり得意中の得意です。

特にプログラム開発が必要になるようなカスタマイズは遠慮なくご相談ください。

メールやSNSなどのメッセージで簡単に連絡いただいたあとで、電話していただけると確実です。
※電話にはスカイプ・Google Meet・Zoomなども含みます。

デザイナーさんや営業・ディレクションをされてる方は特に歓迎です。