如何使用javascript检查HTMLCollection是否包含具有给定类名的元素?

如何使用javascript检查HTMLCollection是否包含具有给定类名的元素?,javascript,Javascript,嗨,我是编程新手,我想使用javascript访问对象内部的数组 我的数据结构如下所示 const some_obj = { accessKey: "", children: [ div.someclassname, div.someclassname, div.someclassname.highlight, ] } 下面是我在浏览器控制台中记录变量时的样子 object current: div.wrapper

嗨,我是编程新手,我想使用javascript访问对象内部的数组

我的数据结构如下所示

const some_obj = {
    accessKey: "",
    children: [
        div.someclassname,
        div.someclassname,
        div.someclassname.highlight,
    ]
}
下面是我在浏览器控制台中记录变量时的样子

object
current: div.wrapper
    accessKey: ""
    align: ""
    childElementCount: 4
    childNodes: NodeList(4) [div.someclassname, div.someclassname.highlight, 
    div.someclassname]
    children: HTMLCollection(4) [div.someclassname, 
    div.someclassname.highlight, div.someclassname]
在控制台中打印一些_obj.children将给出以下输出。 对象.儿童 HTMLCollection(3) 0:div.someclassname 1:div.someclassname.highlight 2:div.someclassname

现在,从some_obj中,我想检查some_obj是否在子数组中具有div.classname.highlight。我该怎么做呢

我试着用 一些对象current.children.find()但是说find不是一个函数


如何检查some_obj子级是否具有div.someclassname.highlight。有人能帮我解决这个问题吗?谢谢听起来你好像在找一些孩子。包括(someClass)


请参阅。

我认为没有比
HTMLCollection
更优雅的解决方案,但这是可行的


.选定{
字体大小:粗体;
}
  • 一个
  • 两个
  • 三个
var find=函数(类名){ var elements=document.getElementsByClassName('test'); var elementsArray=[].slice.call(元素); 对于(var index=0;index
由于子项不是简单的
数组
,而是HTMLCollection和/或节点列表,因此应该查看的是:
Array.from(NodeList)

假设我们想找到
div.someclassname.highlight
元素是否存在于
子元素上(测试类名
someclassname
&
highlight


注意:上述测试将通过任何具有类名
someclassname
高亮显示
的dom元素,而不仅仅是
div

Hi可能重复,是
div.classname。突出显示
a字符串?从控制台的输出中,它是一个htmlcollection。我认为它不是一个字符串。出于某种奇怪的原因,它说indexOf不是一个函数。你能在你的问题中粘贴
console.log(some_obj,some_obj.children)
的输出吗?如果这是你要找的,我建议将标题更改为
如何检查HTMLCollection对象是否包含具有给定类名的元素。我看到您更新了标题。上面的代码片段有用吗?刚刚添加了IE支持。谢谢。我如何返回包含测试所选类名的元素,而不是true。也不起作用。我将再次用数据结构更新我的问题。注意:
Array.from
在IE和旧浏览器中不起作用。见@sunknudsen Yep我知道+1。这可能是唯一的警告。broswers的其他支持几乎都在那个里,除非有人像真正的老版本一样在那个里。例如:Chrome 45进入了
2015
谢谢你的回答。因为我希望它支持所有浏览器,所以我接受了另一个。但这同样有效:)
let childrenNodeArr = Array.from(some_obj.children);
/*or with spread operator [...some_obj.children]*/
/*each element is a dom node we can run classList.contains*/
const elemFound = childrenNodeArr.find(
  e =>
    e.classList.contains("someclassname") && e.classList.contains("highlight")
);

if (elemFound) {
  /*yes a div.someclassname.highlight*/
}