Question

如何通过getElementById获取一个id名称下的元素的类名？

我试过

HTML

<ul>
<li><div id="navTabs" class="tab1">1</div></li>
<li><div id="navTabs" class="tab2">2</div></li>
<li><div id="navTabs" class="tab3">1</div></li>
<li><div id="navTabs" class="tab4">2</div></li>
</ul>

Javscript

document.getElementById("navTabs").onclick = function tab_click() {
assignedTabName = document.getElementById("navTabs").className;
alert(assignedTabName);
}

它不起作用。 HTML声明对每个对象使用单独的id和class名称。我正在尝试为每个选项卡添加一个id名称和单独的类名称的选项卡内容框。

对象名称的 HTML语法似乎有误。但是，如何仅使用javascript，而不是jquery 来使用相同的id名称和单独的类名？

Answer 1

你不能。

getElementById会返回单个元素（如果没有匹配，则返回null。）

ID 必须在文档中是唯一的。您正在尝试处理非HTML的内容。

类用于将元素标记为组的成员。你似乎有他们和ID向后。

您可以使用querySelectorAll和属性选择器来解决它：

var elements = document.querySelectorAll('[id=navTabs]');

...但你应该修改标记。

Answer 2

你不能，getElementById返回单个元素，如果不存在则返回null。

ID必须是唯一的。

如果你正在使用jQuery，你可以听父<ul>：

$('ul').on('click', 'a', function() {
    e.preventDefault(); //don't follow the link
    console.log($(this).attr('class'));
});

//编辑：我现在看到不是jQuery 部分，检查querySelectorAll就像@Quentin说的那样，但是你真的应该修改你的标记。

Answer 3

我猜javascript仍在开发中以管理HTML类型语言，并且它没有为管理列表菜单材料提供的良好功能，而不是现在使用jquery。

如何通过Javascript中的getElementById获取一个id下的元素的类名？

3 个答案: