如何使用JavaScript为父元素下的子<a>标签添加指定属性

• 原有代码直接对class为Master的父级div执行属性添加操作，属性自然会绑定到父元素而非子元素上，只需先定位到父元素内部的目标<a>标签，再执行属性设置即可。

// 第一步：获取父元素
const masterWrapper = document.querySelector('.Master');
// 第二步：匹配父元素下的a标签，若有多个a标签可调整选择器做精准匹配
const targetLink = masterWrapper.querySelector('a');
// 第三步：给目标元素添加属性
targetLink.setAttribute('aria-label', 'demo');

如果父容器下存在多个<a>标签，需要更精准的定位，可给目标<a>标签添加专属类名，示例如下：

1. 修改HTML部分，给目标a加类名

<div class="Master">
  <a href="#" class="master-target-link">
    <div>dummy</div>
  </a>
</div>

2. 调整JS选择器

const targetLink = document.querySelector('.Master .master-target-link');
targetLink.setAttribute('aria-label', 'demo');

内容的提问来源于stack exchange，提问作者johny