如何重定向到子选择器中定义的链接[重复]答案

【问题标题】：how to redirect to a link wich is defined in child selector [duplicate]如何重定向到子选择器中定义的链接[重复]
【发布时间】：2021-11-29 13:37:17
【问题描述】：

我想在点击该项目时重定向

例如：class="nav-item" data-nav-item="1"

到他的子标签“a”中定义的链接

<div class="nav-item" data-nav-item="1">
  <div class="item-parent">
    <a href="https://mywebsite-men.com">MEN</a>
  </div>
</div>

<div class="nav-item" data-nav-item="2">
  <div class="item-parent">
    <a href="https://mywebsite-women.com">Women</a>
  </div>
</div>

【问题讨论】：

你不能把divs 包裹在a 标签中吗？
欢迎来到 Stack Overflow！访问help center，使用tour 了解内容和How to Ask。请首先>>>Search for related topics on SO，如果您遇到困难，请发布您的尝试的minimal reproducible example，并使用[<>] 记录输入和预期输出sn-p 编辑器。
@Seblor 它将改变 css 的旧设计，我不想这样做

标签： javascript jquery

【解决方案1】：

可以使用click在父元素被点击时触发点击

[...document.getElementsByClassName('nav-item')].forEach(item => {
  item.addEventListener('click', (e) => {
    item.querySelector('a').click()
  })

})

.nav-item {
  width: 50px;
  height: 20px;
  padding: 10px;
  border: 1px solid green;
  cursor: pointer;
}

<div class="nav-item" data-nav-item="1">
  <div class="item-parent">
    <a href="https://mywebsite-men.com">MEN</a>
  </div>
</div>

<div class="nav-item" data-nav-item="2">
  <div class="item-parent">
    <a href="https://mywebsite-women.com">Women</a>
  </div>
</div>

【讨论】：

这 3 点里面是什么...，对不起，我是 javascript 新手，我这样说 ===> document.getElementsByClassName('nav-item')].forEach(item = > { item.addEventListener('click', (e) => { item.querySelector('a').click() }) })
forEach 是一个数组方法 document.getElementsByClassName('nav-item') 返回一个集合，但数组方法不能直接用于集合。那个...是用来把nodelist集合转成数组，这样就可以使用数组方法了
它不起作用我这样说 ==> [...document.getElementsByClassName('nav-item')].forEach(item => { item.addEventListener('click', ( e) => { item.querySelector('a').click() }) })