在 css html 中使用冒号从多个 div class 中获取元素

Question

有2个类同名

<div class="website text:middle"><a href="/class/name" class=" "> A</a></div>
<div class="website text:middle"><a href="/class/grade" class=" "> 1</a></div>

如何得到A和1？我尝试将 getElementById 与 :eq(0) 一起使用，它给出了 null

Answer 1

方法 getElementById 查询具有指定 id 而非 class 的元素；我也不确定你想用 :eq(0) 查询什么。

尝试：

// String html = ...
Document doc = Jsoup.parse(html);
List<String> result = doc.getElementsByClass("text:middle").eachText();
// result = ["A", "1"]

编辑

您可以查询匹配多个class的元素！参见 Jsoup select div having multiple classes。

但是，冒号（:）是css中的一个特殊字符，当它作为[=的一部分出现时需要转义36=] 选择器查询中的名称。我不认为 jsoup 目前支持这个并且只是将冒号后的所有内容视为 pseudo-class.

Answer 2

document.querySelectorAll(".website")[0] // 0 is child index

你应该使用 querySelector 它被所有浏览器完全支持检查此以获取支持详细信息 support

Answer 3

添加到 Janez 的正确答案中 - 虽然 jsoup 的 CSS 选择器（当前）不支持转义 class 名称中的 : 字符，但还有其他方法可以获取如果您想使用 select() 方法而不是 getElementsByXXX，它就可以工作——例如如果你想在一次调用中组合选择器：

Elements divs = doc.select("div[class=website text:middle]");

这将找到 div 个具有文字属性 class="website text:middle" 的元素。 Example.

或者：

Elements divs = doc.select("div[class~=text:middle]");

这会找到具有与正则表达式 /text:middle/ 匹配的 class 属性的元素。 Example

虽然对于呈现的数据，我认为 getElementsByClass() DOM 方法是可行的方法，也是最通用的方法。我只是想为其他情况展示几个替代方案。

在 css html 中使用冒号从多个 div class 中获取元素

Get element from multiple div class with colon in css html

java

jsoup