javascript - 使用这个系统来布局网页有什么潜在的问题?

标签 javascript css web-applications

<分区>

对 CSS 的许多限制和兼容性问题感到沮丧,并且发现自己经常需要编写 javascript 代码以使我的网页按照我想要的方式布局,我认为我可以通过完全放弃 CSS 来构建页面结构来简化 future 的元素.

我编写了一个 javascript 库,它解析 XML 文件中指定的布局,并使用绝对定位和大小的非嵌套 div 将它们应用于 HTML 文档。所以这个想法是每个页面都有一个包含所有内容的 HTML 文件,一个指定内容在页面上的排列方式的 XML 文件,以及一个用于表面样式的 CSS 样式表。

Here is an example. (按下按钮使布局膨胀。已在所有主流浏览器的最新版本中进行测试。) And another.

这个系统优雅地降级为纯 html,甚至允许在禁用 javascript 的情况下使用单独的样式。

在我看来,这种方法不仅消除了很多跨浏览器的问题,而且让我能够用更少的工作实现更复杂的布局。例如,我的理解是,仅靠 CSS 无法完成以下操作,至少在没有乱七八糟的嵌套 div 的情况下无法完成:

  1. 设置元素以填充其父容器内的可用宽度或高度。 (这与 width/height:100% 不同,如果父容器中还有其他元素。)
  2. 在任何容器内将任何元素顶部/中心/底部、左/中心/右对齐,即使其大小未知。
  3. 填充一个未知大小的元素,而不增加该元素的大小(例如,如果一个 div 设置为窗口大小的 100%,则在不溢出窗口的情况下无法填充它。)
  4. 自动将父元素中的所有元素设置为等间距。
  5. 设置 float 元素的高度。同样,独立设置水平和垂直收缩包装行为。
  6. 设置元素 float 在列而不是行(CSS3似乎支持列但浏览器兼容性不好)

尽管如此,我确信这被认为是亵渎神明的。那么,使用该系统布局网页有哪些潜在的问题呢?

编辑:the code is on github

最佳答案

从本质上讲,您是在尝试以一种您认为比 CSS 做得更好的方式重写 CSS。这可能很好——也许对你有用——但你将面临限制。

世界其他地方都使用 CSS。让一个人(你)学习和遵循标准通常比试图让世界其他人学习和遵循你的标准更容易。如果您与其他任何人一起开发,他们将不得不学习您的 Web 开发方法,而不是能够将他们的 CSS 和 HTML 知识带到桌面上。

如果你去别处工作,你要么必须说服他们能够将你的方法带到桌面上,而不是使用 CSS 的世界标准(这在公司环境中通常行不通),否则您将不得不学习如何正确使用 CSS。

如果您希望从其他人那里获得帮助(例如 stackoverflow 上的此处),您将无法获得帮助,因为其他人都使用 CSS。但如果您有 CSS 方面的问题,我们可以提供帮助。

这就是为什么它可能被认为是“亵渎神明”的原因。我确定您写这个问题的目的是为了获得有关该方法潜在技术问题的反馈,但我认为政治/社区问题同样重要。

关于javascript - 使用这个系统来布局网页有什么潜在的问题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17221029/

相关文章:

html - 如何在同一行div上插入2张图片和1个文本框

Javascript 问题 : Detecting children currently in view within an 'overflow: auto;' parent element?

javascript - 如何使用 Node.js 的加密库生成 scrypt 哈希?

javascript - 警告在设定时间内消失

html - 使用css3动画的 float 按钮

javascript - 使用 jQuery 添加类仅适用于第一个元素

javascript - 移动 safari 对大图像进行降采样。如何挽留?

表中的 CSS 问题

java - Spring MVC Web 应用程序中未找到 Json Webservice

java - Web应用程序和应用程序之间的区别?