javascript - 最大限度地减少应用程序中表单的重复代码

Question

我有一个使用很多表单的应用程序。我使用这样的引导表单字段:

        <form id="NewComp">
        <table width="100%" border="0">
            <tr>
                <td>
                    <div class="form-group">
                        <label for="NameInput">Naam</label>
                        <input type="text" class="form-control" id="NameInput" placeholder="Example input">
                    </div>   
                </td>
                <td style="padding:0 15px 0 15px;">
                    <div class="form-group">
                        <label for="FullNameInput">Volledige naam </label>
                        <input type="text" class="form-control" id="FullNameInput" placeholder="Example input">
                    </div>
                </td>
            </tr>
        </table>
</form>

这些表单可能很大，因此我想使用 include 或 .js(外部函数)来简化事情，以保持我的主页更干净。

例如:

<form id="NewComp">
        <table width="100%" border="0">
            <tr>
                <td>
                    <div class="myTextField" parameters"label=Naam, id=NameInput"></div>
                </td>
             </tr>
    </table>
 </form>

当我了解如何实现此类目标的基础知识时，我可以针对我的代码进行调整，甚至删除一些代码。

有人能指出我正确的方向吗？

Answer 1

好吧，我会尽力给你一些建议，这对于评论来说太长了，但不能真正被视为答案..

首先，如果您想要一个基本的网站，并且您不是/不想成为一名网络开发人员，那么只需保留您现在的代码即可，完全没问题。

如果您想学习代码或尝试构建大型且可扩展的应用程序，您可以尝试学习一些东西(这里有一些示例，但您可以在那里找到很多很棒的 Web 开发教程) :

• 如果您想摆脱引导类(这确实很好)，您可以包含自己的 CSS 页面。
• 如果你想动态渲染 html，你可以查看 html 模板并继续使用基本的 jquery，除非你想手动处理模板，否则你必须包含一个处理它们的 javascript 库，例如 underscore.js 。如果您只是想要一个减少代码量的快速解决方案，这可能是更适合您的解决方案。
• 如果你想构建一个更大的应用程序，你可能想学习一些 js 框架，如 ReactJS、VueJS 或 Angular(它们有很多，但这 3 个是目前最流行的)。但如果您是 JavaScript 和编程新手，那么其中一个工具的学习曲线会有点长。

希望这有帮助