Добавление атрибута к элементу Javascript

#javascript #attributes #selectors-api

#javascript #атрибуты #селекторы-api

Вопрос:

Я начинающий пользователь JavaScript, и мне могла бы понадобиться ваша помощь с приведенным ниже запросом:

Мне нужно было найти все li, размещенные в теге nav в html. Теперь я должен проверить, есть ли у li атрибут data-direction, и если его нет — установить этому атрибуту значение «top». Я пытался сделать это с помощью простого цикла, но, похоже, это не работает — я продолжаю получать информацию с консоли о том, что «направление не определено», поэтому кажется, что он не видит «data-direction» в качестве атрибута. Может быть, мне следует указать этот атрибут по-другому? Вот мой код:

    var navLi = document.querySelectorAll("nav li");

   for (i = 0; i < navLi.length; i  ) {
       if (navLi[i].data-direction === " ") {
       navLi[i].data-direction = "top";
      }
   }
  

Заранее спасибо!

Ответ №1:

Вы ищете hasAttribute() / setAttribute() .

 for (i = 0; i < navLi.length; i  ) {
   if ( !navLi[i].hasAttribute('data-direction') ) {
     navLi[i].setAttribute('data-direction', 'top')
  }
}
  

Ответ №2:

getAttribute() вернет значение null или пустую строку, поэтому вам нужно использовать метод hasAttribute() для обработки регистра null.

 for (var item of document.querySelectorAll("nav li")) {
  if (!item.hasAttribute("data-direction") || item.getAttribute("data-direction").trim() === "") {
    item.setAttribute("data-direction", "top");
  }
}