javascript通过ID中的ID获取元素答案

【问题标题】：javascript get element by ID within IDjavascript通过ID中的ID获取元素
【发布时间】：2017-04-03 10:31:24
【问题描述】：

我想计算使用 JavaScript 选中 if 复选框的总价
我不允许通过添加 div 将 id 分隔为 2 部分
例如。

<form id="bookingForm">

 <section id = "checkcost">
      <h2>Total cost</h2>
     Total <input type="text" name="total" value="$0.00" size="10" readonly />
 </section>

</form>

首先，我用这个方法获取id

var frm = document.getElementById('bookingForm')

我正在尝试使用以下代码，但这不是正确的方法

frm.checkcost.total = 计算（）

由于显示总费用的输入区域在 id="bookingForm" 内，因此选中复选框后我应该如何显示总费用？
ps：这是我尝试过的链接，但它不起作用，现在我正在尝试其他方法

onclick in php echo with error invalid unexpected token

【问题讨论】：

给输入一个id然后直接抓取它document.getElementById('myTextInput') = "Something";

标签： javascript

【解决方案1】：

如果表单中只有一个名为 total 的字段，则完全不必担心该部分：

var frm = document.getElementById('bookingForm');
frm.total = calculate();

或

document.querySelector("#bookingForm [name=total]").value = calculate();

如果您有多个名为 total 的字段，则只需使用该部分的 ID：

document.querySelector("#checkcost [name=total]").value = calculate();
// ----------------------^

document.querySelector 查找与给定 CSS 选择器匹配的第一个元素。您可以使用 CSS 的全部功能在文档中查找元素。还有document.querySelectorAll 可以找到匹配元素的list。最后，单个元素也有这两种方法，它们只在这些元素内查看。例如，我们也可以这样做：

var frm = document.getElementById('bookingForm');
frm.querySelector("#checkcost [name=total]").value = calculate();

（但这只是一个例子，不是建议；它比必要的更迂回。）

【讨论】：