Один блок под несколько задач

207

02 апреля 2019, 01:50

Всех приветствую,сразу извиняюсь если название заголовка не совпадает c моим вопросом.

Так вот у меня вопрос можно сделать блок div под несколько задач,например есть три кнопки нажал на одну,в блоке div появилось <h1>Hello world</h1>,нажал на вторую,в том же блоке div появилось <h1>hi</h1> и т.д

Answer 1

$(".mybutton").click(function() { 
  var h = $("<h1></h1>"); 
  h.text($(this).data("text")); 
  $(".output").html(h); 
});

.output { 
  border: 1px solid black; 
  background: lightgreen; 
  padding: 5px; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<button type="button" class="mybutton" data-text="Hello World!">Hello World</button> 
<button type="button" class="mybutton" data-text="Hi!">Hi</button> 
<button type="button" class="mybutton" data-text="Good Bye!">Good Bye</button> 
<br/><br/> 
<div class="output"> 
  <h1>&nbsp;</h1> 
</div>