个人中心
gpt4 book ai didi

javascript - 在标题中获取嵌套按钮 ID

转载 作者：行者123 更新时间：2023-12-05 05:49:41 25 4
gpt4 key购买 nike

我正在尝试引用我的按钮(嵌套在我的标题/导航中)来创建一个事件 onclick，但我似乎无法让它工作。

尝试嵌套 getElementByName 与 getElementById 尝试了一些 querySelector 和 querySelectorAll

尝试过:

var x = document.getElementsByClassName('hdr');
var y= x.querySelector('hdrBtns');
z = y.getElementById('singUp');

尝试过:

const brt = document.querySelectorAll('.hdr .hdrBtns');
const dac = brt.getElementById('signUp');

下面的代码:

 <body>
        <header class="hdr">
            <div class="hLogo">
                <h1>
                    Test
                </h1>               
            </div>

            <nav class="hdrBtns">
                <button id="singUp">Sign Up</button>
                <button id="singIN">Sign In</button> 
                
            </nav>
        </header>
     <script src="./script.js"></script>
    </body>

最佳答案

NodeList Element#querySelectorAll() 或 getElementsByClassName() 返回的方法没有其他元素拥有的方法，例如 getElementById() 或 querySelector( )。

假设您只有一个具有特定 ID 的元素，就像您应该拥有的那样，只需通过此方法选择元素即可:

let btn = document.querySelector("#singUp")

btn.addEventListener("click", () => alert("test"))
<header class="hdr">
  <div class="hLogo">
    <h1>
      Test
    </h1>
  </div>

  <nav class="hdrBtns">
    <button id="singUp">Sign Up</button>
    <button id="singIN">Sign In</button>

  </nav>
</header>

关于javascript - 在标题中获取嵌套按钮 ID，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/70636326/

25 4 0
文章推荐： Thymeleaf 未加载模板
文章推荐： git - 我如何使用 git-filter-repo 来修复错误的日期
文章推荐： sql - 使用 Rails 'contains operator'(或替代方案)搜索多个值
文章推荐： c++ - C++ 中的运算符重载(复制构造函数和析构函数)
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com