gpt4 book ai didi

javascript - 编译成 JavaScript 而不是 CSS 的 CSS 预处理器语言可行吗?

转载 作者:行者123 更新时间:2023-12-04 19:46:25 24 4
gpt4 key购买 nike

我总是在与网络相关的元素中使用 CSS 预处理器。 CSS 预处理器几乎可以让您做 CSS 可以做的所有事情,但支持 DRY 编码原则和更简洁的语法。不过我想知道——为什么不完全放弃样式表呢?为什么不制作一种编译为 JavaScript 的样式语言呢? JavaScript 显然可以完全控制 CSS 样式,所以它应该是可能的。这种语言也将比普通 CSS 强大得多,因为它可以启用逻辑,例如基于元素大小和位置的选择器、浏览器窗口大小等。一个人为的可能性示例:

div#test {
if windowWidth > 800px {
width: (windowWidth / 3 + 10)px;
height: 200px;
}
else {
width: 100px;
height: 50px;
}
}

或者一个绝对定位的 div,但当它向下滚动太远时应该跟随窗口:

div#side_panel {
position: absolute;
top: 100px;
right: 25px;

if windowScrollY > 90px {
position: fixed;
top: 10px;
}
}

我已经尽我所能用谷歌搜索了这个主题,但没有成功。 是否有任何样式语言允许动态样式(如我示例中的那些)并编译成 JavaScript?如果没有,为什么不呢?这在性能方面不可行吗?或者可能存在浏览器支持问题?


我知道一些浏览器(包括 Chrome)公开了一个名为 document.styleSheets 的对象,它使 JavaScript 可以完全控制文档的样式,这非常适合此类元素。

最佳答案

几年前我也想过。

在我的结论中,第一点是 CSS 是为 web 设计师设计的,而不是为 web 开发人员设计的。设计师在一次又一次地制作相同的艺术作品时非常有创意,但在编程逻辑和理解编程语言方面也非常愚蠢。那些简单的 if-else 足以让他们发疯。

另一个是性能。 CSS 旨在为整个页面布局设置样式。即使使用 AJAX,JavaScript 也旨在进行少量更改并处理小型用户交互。简单性也近在咫尺,想象一下,如果我们仅使用 JavaScript 从 HTML 文档构建整个布局。

还有稳定性问题。 CSS 解析和处理由浏览器的引擎处理,经过测试非常好,比我们自己的 JS 代码要多得多。如果我们使用 Unobstructive JavaScript,我们的网站将在应用 CSS 和加载图像时完全正常工作,因此如果 JS 错误它仍然可以正常工作。想象一下,如果布置页面的 JavaScript 代码崩溃了。为此,我们只需要一个无限循环,它肯定可用。

最后,我们必须将内容-HTML、外观-CSS 和感觉/行为-JavaScript 分开。因此,只需提供 HTML 文档中的所有内容,即使它会保持隐藏状态。使用 CSS 以工作方式设计所有内容,并尽可能提供最好的静态页面。然后使用 JS 仅对布局进行更改,并在需要更改时使用 if-else。

关于javascript - 编译成 JavaScript 而不是 CSS 的 CSS 预处理器语言可行吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14886113/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com