javascriptメモ!これで何行も書く必要がない🥲
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table id='data-table'>
<tr>
<th>項目1</th>
<th>項目2</th>
<th>項目3</th>
</tr>
</table>
<button type="button" onclick="radioDeselection()">選択解除</button>
<script>
var tableEle = document.getElementById('data-table');
for (var i = 0; i < 5; i++) {
// テーブルの行を 5行追加する
var tr = document.createElement('tr');
for (var j = 0; j < 3; j++) {
// テーブルの列を 3行追加する
var td = document.createElement('td');
if (j == 0) {
var c = document.createElement("input");
c.setAttribute("type", "radio");
c.name = "radio"
//td.innerHTML = 'データ1';
td.appendChild(c);
tr.appendChild(td);
} else {
td.innerHTML = 'データ';
tr.appendChild(td);
}
}
tableEle.appendChild(tr);
}
function radioDeselection() {
for (const element of document.getElementsByName('radio')) {
element.checked = false;
}
}
</script>
</body>
</html>
この記事が気に入ったらサポートをしてみませんか?