sildes[0] は、[1] [2] でもよいですか?

動作はしますが、修正などを考慮するとおすすめできません。
2024年7月5日
ユーザー

いつもお世話になります。

下記のコードの「←ココ」について教えてください。

const next = document.getElementById('next');
const ul = document.querySelector('ul');
const slides = ul.children;

next.addEventListener('click',() => {
  const slideWidth = slides[0].getBoundingClientRect().width; ←ココ
  // console.log(slideWidth);
  ul.style.transform = `translateX(${-1 * slideWidth}px)`;
});

ul.children; で、li 要素を配列の形で取得できている理解をしております。
ので、a b c とも同じ幅だと思うので、[1] [2] でも試したところ、同じ挙動をしました。

[3] でしたところ、下記のエラーが出ました。

main.js:9 Uncaught 
TypeError: Cannot read properties of undefined (reading 'getBoundingClientRect')
    at HTMLButtonElement.<anonymous> (main.js:9:32)

この [0] は、はじめが a つまり [0] なので、[0] にしただけで、3 つの li 要素がすべて同じ幅であるならば、
[1] [2] でも構わない認識でよろしいですか?

よろしくお願いいたします。



この回答を見るにはプレミアムプランへの登録が必要です

プレミアムプランとは?

このレッスンの質問と回答(14)