Question

我正在尝试编写一个切换器，该切换器将显示/隐藏具有特定标签的任何给定页面上的所有内容。我面临的问题是我无法弄清楚如何识别元素。

使用称为MadCap Flare的程序创建网页。在Flare中，您可以将条件文本标签添加到元素中，以帮助确定构建的内容和未构建的内容（以及其他内容）。在最终的HTML输出中，这些条件文本标记仍然存在。因此，带有条件文本标签MyTag的段落将显示为：

<p data-mc-conditions="MyTag">Here is my paragraph text.</p>

鉴于这些条件文本标签是Flare固有的，我试图找到一种方法来识别具有特定条件文本标签的所有元素。

我查看了GetElementByID，GetElementsByTagName，GetElementsByClassName，希望有类似查询的内容并找到具有给定条件文本标记的所有元素。

Answer 1

您可以为此使用CSS选择器和javascript的组合：
document.querySelector("p[data-mc-conditions='MyTag']");

document.querySelector("p[data-mc-conditions='MyTag']").style.border = "5px solid yellow";

<p data-mc-conditions="MyTag">Here is my paragraph text.</p>

w3schools.com描述了querySelector：

querySelector()方法返回与document中指定的CSS选择器匹配的第一个元素。

但是，您可能有多个元素，因此，您想使用
querySelectorAll()。
但是您必须逐一遍历元素：

var elements = document.querySelectorAll("p[data-mc-conditions='MyTag']");

for (var i = 0; i < elements.length; i++) {
  elements[i].style.border = "5px solid yellow";
}

<p data-mc-conditions="MyTag">Here is my paragraph text.</p>
<p data-mc-conditions="MyTag">Here is my paragraph text.</p>
<p data-mc-conditions="MyTag">Here is my paragraph text.</p>
<p data-mc-conditions="MyTag">Here is my paragraph text.</p>

有没有一种方法可以通过特定值获取元素

1 个答案: