Javascript 内-h-t-m-l上使用getElementsby#方法的聚合物

我试图在通过inner-h-t-m-l加载的文本中检索不同元素的属性，但我无法只获取一个特定元素

这是我的密码：

<template>

<iron-ajax
      auto
      url="[[some/path/url.html]]"
      handle-as="text"
      last-response="{{inputText}}"></iron-ajax>

<div class="textcontent" inner-h-t-m-l="{{inputText}}"></div>
</template>
<script>
    Polymer({
      is: 'text-page',

      ready: function() {
        var test = document.getElementsByClassName("author");
        console.log(test);
      }
    });
</script>

这是正确的，有3个元素的类名为“author”。但是，当我对

console.log（test[0]）

执行相同的操作以仅获取第一个时，我会将

作为“未定义的”

输出。如何仅获取第一个，更重要的是，该

span

的值

是的，我个人认为这是将HTML加载到聚合元素中的最佳方法，除非您可以使用正常的方法

使用

getElementsByClassName

您将获得一个

HTML集合

，您无法直接访问这些元素的值。 您可以使用不同的方法将其作为数组或数组来获取。 另一个解决方案是使用简单的

this.querySelectorAll（）

将它们作为数组

澄清和

consthtml=`testather`
addEventListener（'WebComponentsReady'，函数（）{
聚合物({
是：“x-example”，
特性：{
html:{
类型：字符串，
值：html
}
},
就绪：函数（）{
//1°溶液
const test=this.getElementsByClassName（'author'）；
const first=Array.from（test）[0]；
log（'First element innerText-->'，First.innerText）；
//或者您可以简单地在数组上循环
from（test）.forEach（item=>console.log（item.innerText））；
//2°溶液
const test2=this.querySelectorAll（'.author'）；
test2.forEach（item=>console.log（item.innerText））；
}
});
});
正文{
字体系列：无衬线；
}

：主持人{
显示：块；
}
多小提琴
如果我使用
数组。从
返回一个空数组。如果我在上面的代码中执行了
console.log（test.length）
，它也会返回
0
。下面是一个工作示例（虽然没有
ironajax
），打开控制台查看结果：谢谢！这在没有iron ajax的情况下是有效的，但是当我添加iron ajax时，如果失败了。经过一番搜索，我发现这一定是因为函数是在加载文本之前调用的，所以
第一次
是
未定义的
。因此，我添加了一个
if（first！==undefined）
，然后它工作得很好。我说得太快了。再看远一点，我注意到它不是从导入的HTML文件中获取信息，而是从一个子元素中获取信息。当我删除它时，它再次给出了未定义的first。是的，问题似乎是您没有等待元素被附加。您可以为此使用观察者。下面是一个观察者的工作示例：。我正在用聚合物生命周期的
ready
回调模拟
ironajax
。我希望有帮助！
HTMLCollection[0]
0: span.author
1: span.author
2: span.author
length: 3
__proto__: HTMLCollection