单击控制台中的show元素后

Question

我需要帮助。我在html类中有一个按钮“ rekapitulace”。我想做的是，如果用户单击该按钮，它将在文本输入中显示“ jmeno”类的项目。我写了这个，但这是不正确的。有解决方案吗？

function rekapitulaceButton() {
var rekapitulaceButton = document.getElementsByClassName('rekapitulace')
rekapitulaceButton.addEventListener('click', precistUdaje)
}

function precistUdaje() {
var jmeno = document.getElementsByClassName('jmeno')
localStorage.setItem('local-jmeno', jmeno)
console.log(localStorage.getItem('local-jmeno'))
}

Answer 1

getElementsByClassName()返回提供的类名的所有元素，而不仅仅是单个元素。注意该方法的名称如何包含复数elements个单词。

要获得第一个元素，您可以执行：

const rekapitulaceButton = document.getElementsByClassName('rekapitulace')[0];

另一种可能性是document.querySelector()，它总是返回一个元素（第一个匹配项）或null：

const rekapitulaceButton = document.querySelector('.rekapitulace');

Answer 2

document.getElementsByClassName（'rekapitulace'）返回一个节点列表数组，因此，如果需要返回一个使用id而不是class的节点，则为一个元素

document.getElementById('rekapitulace')

Answer 3

请注意，您可能将localStorage误用于调试。 .set的第二个参数应为字符串。

如前所述，您应该真正尝试使用ID而不是使用类来定位正确的输入，而document.getElementsByClassName返回多个元素，而不仅仅是一个元素。