ホームページ >ウェブフロントエンド >CSSチュートリアル >CSS と JavaScript を使用して「要素」で選択したオプションの背景色を変更するにはどうすればよいですか?

CSS と JavaScript を使用して「要素」で選択したオプションの背景色を変更するにはどうすればよいですか?

Susan Sarandon
Susan Sarandonオリジナル
2024-12-04 16:03:18280ブラウズ

How Can I Change the Background Color of a Selected Option in a `` Element Using CSS and JavaScript?

一方、CSS には

提供されているサンプル HTML コードでは、

ここで JavaScript が介入します:

var sel = document.getElementById('select_id');
sel.addEventListener('click', function(el){
    var options = this.children;
    for(var i=0; i <p>このスクリプトでは:</p>
  • ユーザーが
  • 要素を取得すると、すべての子要素 ​​(オプション) をループして色を白に設定します。
次に、選択されたオプションを取得し、その色を赤に設定して、残りのオプションから強調表示します。

この JavaScript ソリューションでは、選択したオプションの背景色をカスタマイズできますが、要素の CSS スタイルは直接変更されないことに注意することが重要です。 JavaScript を通じて要素の動的な外観を操作します。このアプローチは、要件が選択されたオプションの背景色のみをカスタマイズすることであり、

以上がCSS と JavaScript を使用して「要素」で選択したオプションの背景色を変更するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。