如何通过以特定字符串开头的类名获取元素？

Question

我需要通过以以下内容开头的ClassName获取元素：

width-48 height-48 profile_view_img

完整标记：

<div class="width-48 height-48 profile_view_img_9131256"></div>

这个类的数量总是在变化。

目前我尝试过以下方法：

var x = window.document.querySelectorAll("*[class^=\"width-48 height-48 profile_view_img\"]")[0]

- Andrew

---

你为什么想要使用这样脆弱的选择器？ - Ram

你的代码应该可以运行：https://jsfiddle.net/5wvu7b8y/2/ - Jacques Marais

@Jacques Marais 返回的是[object HTMLSpanElement]，但是它怎么能够返回恰好的类名呢？ - Andrew

@Andrew，您想获取元素的className吗？ - Jacques Marais

@Jacques Marais 谢谢您，非常感谢！它成功了！ - Andrew

Answer 1

尝试以下步骤：

var x = window.document.querySelectorAll("*[class^=\"width-48 height-48 profile_view_img\"]")[0]
var className = x.className;

JSFiddle.

- Jacques Marais

Answer 2

您可以像这样使用querySelector：

var element = document.querySelector(".width-48.height-48.profile_view_img");

或者只需使用 getELementsWithClass，它可以像这样接受空格：

var elements = document.getElementsByClassName("width-48 height-48 profile_view_img");

- thepio

---

原帖的意思是类名应该以这些字符串开头，而不是完全等于这些字符串。 - Jacques Marais

Answer 3

你已经快成功了。

尝试一下：

var x = document.querySelectorAll('.width-48.height-48.profile_view_img')[0];

这段话的意思是：

令变量 X为包含类 .width-48、.height-48 和 .profile_view_img 的文档中的第一个元素。

- Rounin

---

OP 的意思是类名应该以这些字符串开头，而不是完全等于这些字符串。 - Jacques Marais

如果找不到这样的元素会发生什么？ - Dropout

你是对的，@JacquesMarais - 我错过了那个。 - Rounin

Answer 4

针对具有以下类名的第一个元素：

width-48、height-48 和 profile_view_img

您可以尝试使用以下代码：

var x = window.document.querySelectorAll("*[class^='width-48'] *[class^='height-48'] *[class^='profile_view_img']")[0]

- José M. Carnero

---

这是后代选择器。 - gcampbell