我目前正在使用 Zendesk,并尝试更改页面上的文本元素。遗憾的是,Zendesk 的元素足够动态,以至于主元素的名称会在每次页面加载时发生变化。
幸运的是,元素树的结构保持相当静态,但只有父元素的名称发生了变化:
#ember6030 > div.comment > div > p
#ember3483 > div.comment > div > p
目前,这是我目前所处的位置:
var item = document.querySelectorAll("[name^=ember] > div.comment > div > p");
var itemtext = item.innerHTML;
console.log(itemtext);
我确定我遗漏了一些东西,但是我的选择器变量不正确吗?
类似于查找一个以“ember”开头但随后跟随父子树的其余部分的元素。
<小时/>编辑:事情比我想象的要顽固一些,但如果这有帮助的话,我有一些额外的细节:对于 div.comment > div > p
元素,其中有一些加载。目前,我想尝试仅定位一个元素,但如果我能够在控制台消息中获取所有这些元素的文本内容,那就太棒了。
最佳答案
对于您将使用的 CSS 路径:
var item = document.querySelector("[id^=ember] > div.comment > div > p");
var itemtext = item.textContent;
console.log(itemtext);
因为 #
是 id
属性的 CSS 选择器,而不是 name
。
另请参阅David Klinge's answer关于 NodeList。
所以最终代码是:
var items = document.querySelectorAll("[id^=ember] > div.comment > div > p");
items.forEach (item => {
var itemtext = item.textContent;
console.log(itemtext);
} );
<小时/>
最后,对于您似乎想要做的事情,您可能需要 textContent
而不是 innerHTML
。这可以避免对属性、评论等的错误点击。
关于javascript - 如何选择具有动态 ID 的父元素的嵌套子元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55860447/