网页布局完全由javascript生成是错误的吗?

时间:2012-08-01 14:03:09

标签: javascript jquery html

我目前正在开展一个项目,并用Javascript编写了整个页面。

我创建了一个基本功能:

create_element(parent, type, style, attributes);

示例用法:

var container = create_element(document.body, "div", {width: "100%", height: "100%"});
var header_bar = create_element(container, "div",  {width: "100%", height: "50px"});
var title_span = create_element(header_bar, "span", {fontSize: "18px", fontFamily: "arial", color: "black"});
title_span.innerHTML = "Example Website";

等等......

我将此方法用于网站的整个布局。使用这种方法有一个很大的缺点吗?显而易见的一个事实是,可能仍有人因为JS被禁用。

如果Javascript正在创建和呈现项目而不是将它们硬编码到HTML中,那么页面加载时间是否有明显差异?

谢谢!

TL; DR -

创建一个create_element函数,并使用它将所有元素绘制到屏幕上。包括页面的基本布局。

6 个答案:

答案 0 :(得分:8)

当您尝试动态生成非动态内容时,您会遇到许多问题:

  1. 可维护性将变得非常困难。如果您想对网站进行彻底的更改,那么您将不得不编辑JS而不仅仅是更改CSS或某些HTML。
  2. SEO - Google无法为动态数据编制索引。如果您希望通过搜索引擎找到您的网站,这并不好。
  3. 您正在混合图层。通过不区分问题(您的观点与您的内容与......),您再次增加可维护性问题并为您的未来或其他未来必须触摸您的代码的开发人员创建问题。
  4. 现在,做一些动态生成并没有错 - 但要做得恰当。我强烈建议不要为整个网站动态生成内容。

    根据对原始问题的评论进行更新

    你很高兴你喜欢JS。并且,我绝对同意HTML可能有点无聊。但是,如果你正确地分离了你的顾虑,你真的应该写很少的HTML,并且可以快速回到你喜欢编码的内容。但是,要小心你不要试图强迫某种语言适合它当创建另一种语言以完美地完成它时,意味着要做。 (锤子/指甲规则)

    另外,不要忘记HTML5和CSS3非常强大。你可以用它做很多事情,甚至不用触摸JS(假设满足客户需求)。

答案 1 :(得分:3)

一个主要问题是,如果您像这样构建网站,Google就不会为您网站的任何内容编制索引。

此外,这样您的内容,逻辑和样式也不会分开,如果您在单独的文件和服务器端脚本语言中使用html / css,我认为这是一个巨大的好处。

答案 2 :(得分:2)

如果您确保用于呈现页面的元数据不作为整体评估,则基于来自服务器的响应由javascript生成整个网站并没有错,因为这会导致安全问题。

答案 3 :(得分:0)

在我看来,如果它不是动态内容,那么使用html会更好。

此外,拥有单独的CSS文件比将其设置为内联更合适。

答案 4 :(得分:0)

BackboneJS这样做。您只需确保使用JS在客户端进行服务器端渲染,并且完全在客户端上完成的任何渲染都可以完全或部分在服务器上进行。

答案 5 :(得分:0)

没有理由不能通过javascript完全生成页面内容,但我不会认可这个元素方法。您甚至没有使用任何样式规则,只使用内联样式。此外,在这种情况下,对于html块使用某种模板机制更加可维护,例如在Underscore.js中使用。 (有很多模板解决方案,比如Mustache和Handlebars;我只是给了一个我用过的。)有几种方法可以维护html,而不是在某个javascript文件中,但即使它 在javascript文件中,它比元素业务的元素更易于维护。

相关问题