命名按钮的其他方法？

Question

我正在学习 W3Schools 按钮教程。他们的手风琴按钮示例：

<button class="accordion">Section 2</button>
<div class="panel" id="panel2">
  <p>Lorem ipsum...</p>
</div>

而不是 "Section 2"..我需要根据用户交互动态命名其他名称。当用户在地图上进行选择时，将填充一个包含 table 的手风琴按钮。然后我需要应用名称，而不是提前...使用 javascript，或 jQuery，或 html..我不挑剔。

这可能吗？

Answer 1

尝试使用“.html('new text goes here');”

如果您不确定如何使用 jquery 来设置属性，在您的情况下它将是：

$(".accordian").html('new text goes here');

已更新，它是 .html，而不是 .prop

Answer 2

我给你写了一个函数，当你点击一个按钮时添加一个新的部分 - 你需要将你想要的值传递给那个函数，但是 - 大概来自你的用户输入。

function addSection( section_name, id ){

  var html = '<button class="accordion">' + section_name + '</button>'
    + '<div class="panel" id="panel' + id + '">'
    + '<p>Lorem ipsum...</p>'
    + '</div>'

  document.getElementsByClassName( 'content' )[0].innerHTML += html;

}

document.getElementById( 'add').addEventListener( 'click', function(){
  addSection( 'Section 2', 2 );
});

#add {
  margin-bottom: 20px;
}

<button id="add">Add second section</button>

<div class="content">

  <button class="accordion">Section 1</button>
  <div class="panel" id="panel1">
    <p>Lorem ipsum...</p>
  </div>
  
</div>

命名按钮的其他方法？

Other ways to name buttons?

javascript

dom

naming

button