如何使用javascript从子元素获取值

我有一个包含以下元素的html页面：

<div id="location-id" class="form-control">
      <span class="hub-trigger" data-hub-recordid="28">Germany</span>
</div>

德国

我使用

var element=document.getElementById（'location-id'）

来获取html元素。 请告诉我如何从

span

获取

28

？ 我曾尝试将var

id=element.getElementByTagName（'data-hub-recordid'）

与

val（）

，

text（）

，

innerText（）

一起使用，但没有达到预期效果。

试试看

document.querySelector('.hub-trigger').getAttribute('data-hub-recordid')

还是它

---

标签名是span@DevsiOdedra-jQuery并没有使它比标准DOM更容易。尽管如此，在很多方面-getElements是复数：

document.getElementsByTagName（'span'）[0]。getAttribute（“数据中心记录ID”）

<代码>文档。GetElementsByCassName（'hub-trigger'）[0]。getAttribute（“数据集线器记录ID”）<代码>文档。查询选择器（“[data hub recordid]”）。getAttribute（“data hub recordid”）

const parent = document.querySelector('#location-id');
const child = parent.querySelector('.hub-trigger');

const recordid = child.getAttribute('data-hub-recordid');