JavaScript从第一个事件创建第二个事件

问题描述 投票:2回答:3

我想通过我从第一个事件创建的按钮创建第二个事件。我不知道如何获取ID为btn_event_2的按钮并将其保存到变量中,就像我在第一个事件上所做的那样,因此我无法在第二个按钮上创建事件侦听器。任何建议,谢谢。

let btnEvent1 = document.getElementById("btn_event_1");
let sectionA = document.getElementById("eventDemo");

function createElements(){
  let newHeader = document.createElement("h1");
  let newButton = document.createElement("button");
  let newHeaderContent = document.createTextNode("Hello World 2");
  let newButtonContent = document.createTextNode("click me");
  newHeader.appendChild(newHeaderContent);
  newButton.appendChild(newButtonContent);
  newButton.setAttribute("type", "button");
  newButton.setAttribute("id", "btn_event_2");
  sectionA.appendChild(newHeader);
  sectionA.appendChild(newButton);
}

btnEvent1.addEventListener("click", function(){
createElements();
});
   <!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <meta http-equiv="X-UA-Compatible" content="ie=edge">
            <title>Event Demo 3</title>
        </head>
    
        <body>
            <section id="eventDemo">
                <h1>Hello World</h1>
                <button type="button" id="btn_event_1">click me</button>
            </section>
        </body>
    
        <script src="demoEvent.js"></script>
    </html>
  
javascript html dom
3个回答
2
投票

像已经开始使用新创建的按钮一样简单地使用addEventListener。


0
投票

您可以简单地将事件侦听器附加到newbutton,因为您已经在createElement功能中引用了newbutton。


0
投票

最合适的方法是使用JavaScript event delegationu根据您的事件创建添加事件列表并分配功能在此功能内,如果匹配按钮,您将检查您的按钮ID,然后其余操作]]

© www.soinside.com 2019 - 2024. All rights reserved.