如何使用JavaScript通过id获取类名

Question

我有一个HTML元素，或者列表项，它既有一个id又有一个class。我正在编写自动化测试，需要检查这个元素的class。在测试中，当我调用window.document.getElementById('my-element-id')时，确实返回了正确的元素，但是它上面没有class属性。还有其他方法可以检查class吗？

- Josh Sherick

Answer 1

你要查找的属性是 className。

这里有一个可用的示例：http://jsfiddle.net/xxEtj/ HTML

<ul>
    <li id="myId" class="myClass">Item one</li>
</ul>

JS

var li = document.getElementById('myId');
alert(li.className);

- Jamie Dixon

---

嗨，感谢您的及时回答。我有 <li id="slide-18415" class="zoom-out">。您是说，如果我调用您上面的代码（更改变量名称），它会显示一个名为“zoom-out”的警报框？如果是这样，我认为它出了一些问题，没有起作用。实际上，我正在 PHP 中运行这些命令，但它们通过 selenium（用于测试自动化）运行，并在浏览器中返回内容。但我认为这正常工作，因为当我运行 window.document.getElementById('slide-18415') 时，它会返回 [object HTMLLIElement]。还有什么其他想法吗？ - Josh Sherick

如果li有多个类，该怎么办？ - Cullub

Answer 2

document.getElementById('my-element-id').className

- Jeremy Roman

---

嗨，感谢您的快速回答。我有<li id="slide-18415" class="zoom-out">。您是说如果我调用您上面的代码（更改变量名称），它会返回“zoom-out”吗？如果是这样，出于某种原因，我认为它对我不起作用。实际上，我正在PHP中运行这些命令，但它们通过selenium（帮助测试自动化）运行在浏览器中并返回内容。但我认为这是正常工作的，因为当我运行window.document.getElementById('slide-18415')时，它返回[object HTMLLIElement]。还有更多的想法吗？ - Josh Sherick

Answer 3

适当的属性是.className。

例如：window.document.getElementById('my-element-id').className //返回 "class-1 classes"。

- Justin Long

Answer 4

你可以使用 className。

document.getElementById('myelement').className

- Joe

Answer 5

如果您正在使用document.getElementById('my-element-id').className，有时它不会返回类字符串。当我使用document.getElementById获取SVG元素时，就会发生这种情况。

因此，我的建议是使用.getAttribute()：

document.getElementById('my-element-id').getAttribute('class')

- Dendi Handian