1. ホーム
  2. jquery

[解決済み] jQueryでインデックスを指定して要素を取得する

2022-08-20 13:29:09

質問

順序なしリストがあり、インデックスが li タグのインデックスがあります。私は li 要素を取得し、その背景色を変更する必要があります。これは、リスト全体をループさせることなく可能なのでしょうか?つまり、この機能を達成することができる方法はあるのでしょうか?

以下は私のコードで、うまくいくと思います...

<script type="text/javascript">
  var index = 3;
</script>

<ul>
    <li>India</li>
    <li>Indonesia</li>
    <li>China</li>
    <li>United States</li>
    <li>United Kingdom</li>
</ul>

<script type="text/javascript">
  // I want to change bgColor of selected li element
  $('ul li')[index].css({'background-color':'#343434'});

  // Or, I have seen a function in jQuery doc, which gives nothing to me
  $('ul li').get(index).css({'background-color':'#343434'});
</script>

どのように解決するのですか?

$(...)[index]      // gives you the DOM element at index
$(...).get(index)  // gives you the DOM element at index
$(...).eq(index)   // gives you the jQuery object of element at index

DOM オブジェクトには css 関数がないので、最後の...

$('ul li').eq(index).css({'background-color':'#343434'});

docs:

.get(index) を返します。要素

.eq(index) 戻り値: jQuery

  • 説明 マッチした要素の集合を、指定されたインデックスのものまで縮小する。
  • 参照してください。 https://api.jquery.com/eq/