在CSS动态加载和呈现后运行javascript

我想动态加载css文件，并且在css之后运行js脚本呈现上的文档。我想使用由加载的CSS设置的元素的新宽度和高度。因此，渲染后运行js非常重要。可能吗？我正在使用jQuery。在CSS动态加载和呈现后运行javascript

2013-02-14 RobbeR

把你的Javascript代码放在CSS之后？ – Piccolo 2013-02-14 23:49:09

我想用JS加载CSS，所以它不是一个选项。 – RobbeR 2013-02-15 08:47:25

听起来像是SidJS工作：

SidJS是一个轻量级的JavaScript库，它允许一个包括按需JavaScript脚本的和CSS样式表。它支持与加载过程相关的回调，以确保在您需要时加载的资源可用。

换句话说，您请求样式表并提供回调函数。回调函数在样式表加载完成后执行。例如：

Sid.css("my-sheet.css", function() { 
    // Perform your width/height logic here. 
});

我不能完全肯定，如果该文件将有足够的时间通过执行回调的时间重绘，但你应该尝试一下。在最坏的情况下，你只需使用setTimeout将你的逻辑延迟100ms左右。

来源

2013-02-14 23:52:41 Hubro

这可能是最好的使用这个第三方JavaScript库来实现目标 - 原因是因为动态地附加一个.css文件有一个讨厌的问题，在旧的IE浏览器 - 你不能听任何负载事件称为后可用的CSS ，你必须做非平凡的事情来确保你的回调函数在正确的时间被调用。 SidJS会确保这一点 - 所以你不必担心。不需要'setTimeout' Sid已经创建了一个setTimeout，并且每隔100ms检查样式表是否可用于DOM - 但它只在绝对必要时才这样做 – codefactor 2013-02-14 23:58:24

谢谢！我的项目只适用于具有强大的HTML5和CSS3支持的现代浏览器，所以使用setTimeout不是问题。稍后我会尝试SidJS。再次感谢 – RobbeR 2013-02-15 09:00:54

我了解您的需求，但我强烈建议您在所有替代方案失败后方可执行此操作。

你有多少个CSS文件？他们有多不同？

它甚至会更好地在JS中设置样式，而不是使用它来加载CSS文件。另外，如果你需要让JS知道从CSS文件加载的样式，JS需要知道这些文件在哪里，对吗？提供这些信息而不是文件URL更容易吗？

如果不知道原因，很难想清楚为什么你只知道在页面加载后要加载哪个文件。如果它基于某些用户输入，则可以为一组类使用不同样式的CSS文件，并使用JS来更改元素类，从而删除类样式并向其应用新的类样式。

总是尝试将所有样式保留在唯一文件中，尽量保持它的组织和紧凑性，始终可以重复使用。然后使用JS根据需要更改样式，类和元素。

来源

2013-02-15 00:33:08 Hikari

我知道，它是一种黑客入侵的文件，但我的目标是让项目更舒适。所以，通过CSS听起来像是最好的主意。 – RobbeR 2013-02-15 08:56:43

在CSS动态加载和呈现后运行javascript

回答

相关问题