- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有这样的 html 输出:
<div id="parent">
<ul id="list">
<li class="item">
<a href="picture1.jpg">
<img src="picture1.jpg">
</a>
</li>
<li class="item active">
<a href="picture1.jpg" class="OUR-TARGET">
<img src="picture1.jpg">
</a>
</li>
<li class="item">
<a href="picture1.jpg">
<img src="picture1.jpg">
</a>
</li>
</ul>
</div>
我想获取所有带有标签“a”的元素,这些元素位于类名为“active”的元素内,也包含在 id 为“parent”的元素内。
我目前正在使用document.getElementById('parent').getElementsByTagName('a')
但我不想要所有不活动的 a 标签,只想要那些通过 class= 的嵌套元素激活的标签积极的。谢谢!
最佳答案
首先,只获取active
类的元素,然后遍历这个元素,获取子a
元素。这是一个示例(我为我们的目标提供了 OUR-TARGET
类,因此您最终可以在控制台中看到它并确定它确实是我们的目标):
var activeLis = document.getElementById('parent').getElementsByClassName('active');
for (var i = 0; i < activeLis.length; i++) {
console.log(activeLis[i].getElementsByTagName('a')[0]);
}
<div id="parent">
<ul id="list">
<li class="item">
<a href="picture1.jpg">
<img src="picture1.jpg">
</a>
</li>
<li class="item active">
<a href="picture1.jpg" class="OUR-TARGET">
<img src="picture1.jpg">
</a>
</li>
<li class="item">
<a href="picture1.jpg">
<img src="picture1.jpg">
</a>
</li>
</ul>
</div>
您可以简单地使用 "#parent .active a"
选择器用于 querySelectorAll
方法:
console.log(document.querySelectorAll("#parent .active a")[0]);
<div id="parent">
<ul id="list">
<li class="item">
<a href="picture1.jpg">
<img src="picture1.jpg">
</a>
</li>
<li class="item active">
<a href="picture1.jpg" class="OUR-TARGET">
<img src="picture1.jpg">
</a>
</li>
<li class="item">
<a href="picture1.jpg">
<img src="picture1.jpg">
</a>
</li>
</ul>
</div>
关于javascript - 通过 GetElementsbyClass 内的标签在 GetElementbyID 嵌套的 dom 元素内获取元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46595738/
我正在使用 getElementsByClass 并尝试用仅具有类的 div 替换输入框。但在我的代码中,我使用的是数组 0。 document.getElementsByClassName("ite
我有一个“a href”,它是一个标题。 Vendor1 product title 我想根据标题的第一个单词显示图像。 Vendor1 product title Vendor2 product
var g = document.getElementById('my_div'); for (var i = 0, len = g.children.length; i < len;
我正在尝试做一个成绩计算器网站,但我似乎无法将输入从字符串转换为整数。这是我的代码: CMPS 200
我花了很多时间来解决这个问题。下面是我的 phantomjs 代码 var page = require('webpage').create() page.open("https://www.goog
我有一个跨度: Brand Name 我想根据文本用图像替换该文本 这是我所拥有的: var oldHTML = document.getElementsByClass('attr-value')
我一直在绕圈子。我有一个生成一系列 DIV 元素的 PHP 输出,每个元素都有一个类 L1、L2、L3 等。这些类有一个基本为空的 CSS,因此它们默认显示。 问题是试图根据一个简单的 onclick
我已经删减了这段代码,但我对使用 Class 不是很熟悉。 Poor Sound Quality Only One Speaker is Working No Soun
在 jQuery 中它只是 $("a.class").randommethod(); 或 $(".class1 .class2").randommethod(); 如何使用纯 Javascript 实
这个问题已经有答案了: Why does jQuery or a DOM method such as getElementById not find the element? (7 个回答) 已关闭
我试图通过类名获取一些元素。这是 HTML 文件: ..... .....
我正在尝试编写一个程序,使用 JSoup 从 weather.com 获取天气信息。这是我目前所拥有的: import org.jsoup.nodes.Document; import org.jso
我希望在单击按钮后将光标悬停在“一”类元素上时,光标成为一只手。这是我的代码 function cursor() { document.getElementByClas
这个问题已经有答案了: What do querySelectorAll and getElementsBy* methods return? (12 个回答) 已关闭 5 年前。 我指的是使用 ja
我有这样的 html 输出:
这个问题已经有答案了: "document.getElementByClass is not a function" (12 个回答) 已关闭 9 年前。 我的 Javascript 代码中有以下行
我是一名优秀的程序员,十分优秀!