正在寻找一种分离Javascript和HTML的好方法

Looking for a good way to separate Javascript and HTML

本文关键字：Javascript HTML 方法 分离 一种 寻找      更新时间：2023-09-26

我刚刚开始使用jquery，所以我需要确保我做得很好。我现在就解释一下我的想法，请告诉我你的想法。

首先，我认为服务器的html输出应该主要针对那些没有js或存在浏览器错误的用户。这样，我希望这个页面能为每个人服务。

然后我认为jquery应该有隐藏的数据和模板，用来修改页面。

我不知道模板应该是什么格式。一个想法是把它做成这个

<div id="checkbox-template" class="templatedefinition" style="visibility:hidden">
<input type="checkbox"><label></label>
</div>

这将是完美的，我认为，但我有我的怀疑。另一个想法是使用

$(document.createElement())

然后有几个选项可以处理数据。我试过这样简单的东西：

var fruits= new Array(
    // id - Label - info
    new Array("orange","Orange","some info"),
    new Array("apple","Apple","some info"),
    new Array("banana","Banana","some info")
    );

现在我已经准备好为水果构建复选框并修改原始页面。但在我开始在我的所有解决方案中做这样的事情之前，如果能知道这样的事情是否可行，那就太好了。

首先让我说，你的问题没有硬性规定，imo它可以归结为个人对特定情况的偏好。以下是一些可以帮助您的注意事项：

首先，我认为服务器的html输出应该主要是对于那些没有js或者有浏览器错误的人。那样的话页面将为每个人工作，我希望。

你说的是"；渐进增强"；这是一种策略；可访问性"；到您的网站。要做到这一点，在添加Javascript以增强那些启用了Javascript的用户的体验之前，您需要计划并开发一种适用于那些没有启用Javascript的人的用户体验。你应该在你的设计中计划什么样的功能是"；丢失"；当Javascript不可用时——简单地说——好"；可访问性"；当主要任务像说"；提交表格"；在没有Javascript的情况下仍然可以工作。

您还询问，是应该在html中输出仅用于"增强Javascript体验"的隐藏html元素，还是应该使用Javascript动态"生成"它。这就引出了另一个术语——"；Unobtrusive JavaScript"；。

一种观点是，永远不要在html页面中放任何只适合javascript体验的东西，并使用javascript本身将这些东西添加到DOM中。这样做的好处是，您将拥有一个更干净、更轻量级、更便携的html页面。

另一种思想流派是"少"；纯粹主义者；以及更多"；实用"-意思是做最有效的事。如果你可以简单地将额外的代码直接添加到HTML页面并用css隐藏它，那么就不要额外写100行Javascript代码，也不要额外花2个小时。

我个人认为，作为程序员，我们在做出这些决策时应该始终考虑业务价值。问问自己；我应该花多少时间做这件事&"我是在为5亿还是500万用户创建一个网站&"；。基本上，不要用手榴弹杀死老鼠；）

相关文章：