Я пытаюсь получить текст кнопки, сгенерированной на странице при нажатии кнопки.Кнопки генерируются во фрагменте документа и затем добавляются в DOM.Я написал функцию для получения текста, но когда я нажимаю кнопку, на консоли ничего не регистрируется.Вот что я написал до сих пор:
// get the text of any button clicked
function get_text()
{
var buttons = document.getElementsByTagName('button');
buttons.onclick = function () {
console.log('Button ' + this.innerText + ' clicked');
}
} // ends get_text function
get_text();
document.addEventListener('DOMContentLoaded', function(event)
{
var page_title = document.getElementById('res_number');
page_title.innerHTML = 'Data';
var keys = Object.keys(res_cap);
var length = keys.length;
var docFrag = document.createDocumentFragment();
for (var i = 0; i < keys.length; i++)
{
var button = document.createElement('button');
button.setAttribute('value', keys[i]);
button.innerText = keys[i];
docFrag.appendChild(button);
}
document.getElementById('main').appendChild(docFrag);
}); // ends domcontentloaded event listener
var res_cap = {
1264 : 500000,
13151 : 1710189,
13154 : 5098599,
20813 : 1009625,
20814 : 840000,
200814 : 1056231,
200815 : 912510,
22033 : 1069687,
24140 : 524500,
25191 : 125905,
27916 : 998033,
28150 : 307523,
31901 : 77112,
31902 : 77112,
32939 : 5028131,
33710 : 557152,
33930 : 928917,
43210 : 547733,
43610 : 561586,
43626 : 7000,
51770 : 250000,
51771 : 1100000,
51772 : 1021416,
52698 : 1018576,
53116 : 782764,
62310 : 556293,
62518 : 272600,
63210 : 590902,
}
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/styles.css">
</head>
<body>
<div id='main'>
<h1 id='res_number'></h1>
<table id='res_table'>
<thead>
<tr>
<th id='table_header' colspan='3'>Title</th>
</tr>
<tr>
<th>C1</th>
<th>C2</th>
<th>C3</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div> <!-- ends main div -->
<!-- custom js file -->
<script src='../js/main.js'></script>
</body>
</html>
Как получить кнопки для входа в консоль их внутреннего свойства текста при нажатии?Спасибо за любую помощь.