Warning: file_get_contents(/data/phpspider/zhask/data//catemap/6/google-chrome/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何从具有不同Id的重复父类中获取所有文本内容?_Javascript_Google Chrome - Fatal编程技术网

Javascript 如何从具有不同Id的重复父类中获取所有文本内容?

Javascript 如何从具有不同Id的重复父类中获取所有文本内容?,javascript,google-chrome,Javascript,Google Chrome,我正在尝试获取由addEventListener检测到的父类的所有文本内容 我使用的代码是- document.addEventListener('click',function (event) { var text = document.getElementsByClassName(event.target.parentElement.parentElement.parentElement.className); console.log(text[0].innerText); }, fa

我正在尝试获取由
addEventListener
检测到的父类的所有文本内容

我使用的代码是-

document.addEventListener('click',function (event) {
var text = document.getElementsByClassName(event.target.parentElement.parentElement.parentElement.className); 

console.log(text[0].innerText);

}, false);
但问题是,在我尝试应用代码的地方,例如,具有不同id的相同类名-

<div class="sc-EHOje gMuVTh" size="24" role="group" aria-labelledby="extraTitle_70356820.0">


具有相同的
ClassName
sc-EHOje-gMuVTh)但不同的
id
extractitle\u 70356820.1extractitle\u 70356820.0),因此如果我只使用
ClassName
我总是会得到
id
extractitle\u 70356820.0的文本,即使我点击了附加标题_70356820.1


当存在重复的类名时,如何从我单击的id的类中获取所有文本?有没有一种方法可以同时合并类名和id以从父级获取文本?

我更改了最初的答案,因为我意识到我想您也需要最上面的父级文本以及您单击的元素的文本?我不确定这个答案是否适合你,但这是我的看法

//var classname=document.getElementsByClassName(“sc-EHOje-gMuVTh”);
//对于(var i=0;i
.uppermostpart{
宽度:200px;
高度:200px;
背景:红色;
保证金:1rem;
位置:相对位置;
}
第二上{
宽度:100px;
高度:100px;
背景:蓝色;
保证金:1rem;
填充:1rem;
}
蒂尔杜珀先生{
宽度:70px;
高度:50px;
背景:绿色;
填充:1rem;
}
.sc-EHOje.gMuVTh{
背景:黄色;
宽度:50px;
高度:50px;
}

父文本内容1
一些文本内容
父文本内容2
更多的文字

使用
getElementById(event.target.parentElement.parentElement.parentElement.parentElement.id)
?但老实说,你应该考虑一个策略,它不依赖于点击元素被嵌套在你想要得到的元素下面三深。@ Tethe TimeMyUnter Type Error:无法读取未定义的属性“内文”,你可能仍然有<代码> 0。
在那里不需要,因为
getElementById
返回单个元素…@HereticMonkey,更正了这一点,但我没有从父类中获得任何文本,我还尝试查看
console.log(event.target.parentElement.parentElement.parentElement.id),它也没有显示任何内容。我建议您学习
.queryselectoral()
,这样您就可以在计算父元素时使用复杂的CSS选择器。这些允许类/属性/id/伪等的大量组合。因此
.querySelectorAll('.sc EHOje gMuVTh')
将为您提供一个可以循环使用该类的所有div的节点列表。您的第一个代码是可以的,我不需要最上层的父级,而是我单击的事件的第三个父级的所有文本,位于对我有效的下方-
document.addEventListener('click',function(event)){var classname=document.getElementsByClassName(event.target.parentElement.parentElement.parentElement.parentElement.classname);for(var i=0;i
-但问题是当我打印它时,它会出现多次(等于单击次数),你知道为什么吗?@Mike我看过你的代码,有两个问题:第一次单击最里面的div不会触发,因为for循环中的单击不会触发。它会触发第二次。我认为这是因为创建变量是为了找到parent.parentElem等。第二,每次单击文档,它会创建另一个单击事件。因此后续事件将调用以前生成的单击事件。因此,您将获得3个控制台日志,然后是4个,依此类推。可以提供解决方案(基于我在注释中提供的代码)?我是JS新手,所以我甚至很难用JS进行初级编程。谢谢。嗨@Mike,我已经编辑了上面的代码。你可以在那里查看更新。你使用document.addEventListener的方法('click'…可能是一种更有效的方法。因此我们不再需要执行for循环。我们只需要获取所单击内容的parent,parent-parent元素。
<div class="sc-EHOje gMuVTh" size="24" role="group" aria-labelledby="extraTitle_70356820.1">