如何在 HTML 中使用 JS 动态设置值单选按钮

Question

我是 JS 的新手，我试图动态地将一些文本作为单选按钮的选项值。但我似乎无法让文字出现。我做错了什么？

HTML

<form id="formulier">
<label for="a">
<input type="radio" id="a" name="a">
<!--here I want to show a value from an array ic answer[0]-->
<!--tried also this:   <script>document.write(answer[0]);</script>    -->
</label>
</form>

JS

var answer = <?php echo json_encode($antwoorden); ?>;
const a = document.getElementById("a");

// Ive tried:
a.value = answer[0];
a.innerHTML = answer[0];
a.innerText = answer[0];

他们都没有出现。如何使文本以 HTML 显示？

Answer 1

您不能通过将文本设置为单选按钮的值来输出文本。

您可以将其设置为相关label 元素的文本内容。

为了能够使用 JavaScript 轻松选择关联的 label，请将与 <input type="radio"> 元素的 ìd 相同的 class 分配给它。

HTML 和 JS 代码段

var answer = 'Dynamically inserted Message';
const a = document.getElementsByClassName("a")[0];
a.innerHTML = answer;

<form id="formulier">
  <input type="radio" id="a" name="a">
  <label for="a" class="a"></label>
</form>