Изменить определенный атрибут данных HTML

Question

Я хочу редактировать определенный атрибут данных HTML

data-i18n="[title]tt.navigation_cube_control

на этом сайте "http://potree.org/potree/examples/lion.html" с помощью css / jquery и т. Д., Но каждый раз, когда я пытаюсь его редактировать, ничего не происходит. Я пытался

getAttribute("data-i18n=[title]tt.navigation_cube_control");

также

#navigation img:nth-child(6)

но это не работает для меня. Я пытаюсь просто скрыть этот конкретный «куб навигации» по клику, а также переместить его в css, но он не работает для меня. Я попытался найти файл, который они используют в инструментах разработчика, но не могу найти его. Я скачал их примеры кода и попробовал его таким образом, и он все еще не работает. Я думаю, проблема в том, что у меня неверное имя атрибута, когда я его называю.

Что я хочу сделать, так это иметь возможность скрывать / перемещаться по кубу навигации на веб-сайте выше, используя имя атрибута данных.

Answer 1

getAttribute позволяет получить значение атрибута элемента, это НЕ способ ссылки на элемент. Вы можете увидеть это в документации.

Если вы хотите получить элемент по этому атрибуту и ​​значению, вы должны использовать querySelector для ссылки на него.

const elem = document.querySelector('[data-i18n="[title]tt.navigation_cube_control"]')
console.log(elem)

<div data-i18n="[title]tt.navigation_cube_control">Test</div>

Answer 2

getAttribute получит значение атрибута с именем атрибута.

Так что вы бы использовали: someElement.getAttribute("data-i18n");

… но вы хотите установить значение, а не получить его, поэтому вам нужно setAttribute:

someElement.setAttribute("data-i18n", "your new value");