如何使用JavaScript更高效地提取数据

如何使用JavaScript更高效地提取数据,javascript,loops,Javascript,Loops,我刚刚继承了一个教堂通讯和教区居民联系信息收集的数据收集工具。在一长串的数据点中包括了一些民意调查问题,他们将用这些问题来决定要开发的移动应用程序,以便让家长了解家庭活动的最新情况。我已经多年没有编码了,需要帮助优化我继承的东西 此代码存在于单个HTML文件中,用户可以通过web浏览器按预期访问该文件 我有一个带有数据收集点和可选文本输入字段的表,用户可以使用这些字段输入收集的值。这些值取自各种输入,并放入模板中。有45个这样的值。它们的安排如下: <table class="ta

我刚刚继承了一个教堂通讯和教区居民联系信息收集的数据收集工具。在一长串的数据点中包括了一些民意调查问题,他们将用这些问题来决定要开发的移动应用程序,以便让家长了解家庭活动的最新情况。我已经多年没有编码了,需要帮助优化我继承的东西

此代码存在于单个HTML文件中,用户可以通过web浏览器按预期访问该文件

我有一个带有数据收集点和可选文本输入字段的表,用户可以使用这些字段输入收集的值。这些值取自各种输入,并放入模板中。有45个这样的值。它们的安排如下:

    <table class="table1">
    <tr>
        <td class="col1"><input type="radio" id="noancheck" value="" name="a1" checked></td>
        <td class="col2"><input type="radio" id="ancheck" value="" name="a1"></td>
        <td class="col3">Android Device Identifier</td>
        <td class="col5">&android_id=</td>
        <td class="col4"><input type="text" id="android_id" size ="45" value="" placeholder="INSERT_ANDROID"></td>
    <tr>
        <td class="col1"><input type="radio" id="noecheck" value="" name="a2" checked></td>
        <td class="col2"><input type="radio" id="echeck" value="" name="a2"></td>
        <td class="col3">App Activity Type</td>
        <td class="col5">&etype=</td>
        <td class="col4"><input type="text" id="etype" size ="45" value="" placeholder="INSERT_EHEAD"></td>
    </tr>
    <tr>
        <td class="col1"><input type="radio" id="noicheck" value="" name="a3" checked></td>
        <td class="col2"><input type="radio" id="icheck" value="" name="a3"></td>
        <td class="col3">Apple Device Identifier</td>
        <td class="col5">&idfa=</td>
        <td class="col4"><input type="text" id="apple" size ="45" value="" placeholder="INSERT_APPLE"></td>
    </tr>
    <tr>
        <td class="col1"><input type="radio" id="nobcheck" value="" name="a4" checked></td>
        <td class="col2"><input type="radio" id="bcheck" value="" name="a4"></td>
        <td class="col3">Brand</td>
        <td class="col5">&brand=</td>
        <td class="col4"><input type="text" id="brand" size ="45" value="" placeholder="INSERT_BRAND"></td>
    </tr>
    <tr class="line">
        <td class="col1"><input type="radio" id="noccheck" value="" name="a5" checked></td>
        <td class="col2"><input type="radio" id="ccheck" value="" name="a5"></td>
        <td class="col3">Category</td>
        <td class="col5">&cat=</td>
        <td class="col4"><input type="text" id="model" size ="45" value="" placeholder="INSERT_MODEL"></td>
    </tr>
</table>
单击按钮时,将执行以下操作,并将收集的数据填充到文本区域中显示的模板中:

document.getElementById("formoutput1").innerHTML = 'beginning of data collection template' +
    android_id_string +
    ehead_id_string +
    apple_id_string +
    brand_id_string +
    model_id_string+
    'end of data collection template';

document.getElementById('formoutput2').innerHTML = 'beginning of second template'
    android_id_kvp +
    ehead_id_kvp +
    apple_id_kvp +
    brand_id_kvp +
    model_id_kvp +
    'end of second template';

考虑到每次使用时收集的数据点多达45个,代码相当长。如何对此进行优化?我很难将我所学到的关于循环的知识应用到这一点上,我将非常感激能从中推断出一个例子。

您是否考虑过使用或其他机制?不是你要求的那样,但是不处理长而复杂的表单可能会很好。我最初的想法是‘我们不能像谷歌文档那样做吗?但是,我的志愿者说,作为一项政策,他们不能为此使用任何第三方工具或服务。如果对他们所有人都一样,循环可能会有所帮助……并使用具有属性的对象,以便您可以通过编程方式按名称而不是45个变量访问它们。
document.getElementById("formoutput1").innerHTML = 'beginning of data collection template' +
    android_id_string +
    ehead_id_string +
    apple_id_string +
    brand_id_string +
    model_id_string+
    'end of data collection template';

document.getElementById('formoutput2').innerHTML = 'beginning of second template'
    android_id_kvp +
    ehead_id_kvp +
    apple_id_kvp +
    brand_id_kvp +
    model_id_kvp +
    'end of second template';