Question

因此，在我的网站上，我需要确保即使在JavaScript被阻止时一切仍然有效，这意味着我想要隐藏的东西，直到有人点击某些东西必须用CSS显示然后用JS隐藏在页面加载时使它看起来很小，因为JS文件总是在CSS样式表之后加载。

在加载CSS之前，有没有办法让JS样式更改？比如，停止使用JS加载CSS，进行必要的更改，然后继续加载其他文件，可能吗？

Answer 1

如果你真的想在javascript的一些代码后加载你的css文件： 1.不要指定css的href属性：

<link rel="stylesheet" href="" type="text/css" media="screen" id="my-style">

在您的代码中添加此内容（可能是您的javascript的最后一行）：
。
$（ '＃我的风格'）ATTR（ 'HREF'， '的style.css'）;

并且您的css文件将仅在该行javascript

Answer 2

尝试使用head标记顶部的内联脚本向标记添加.js-enabled类。然后，您可以让CSS隐藏脚本化的东西，同时加载其余的脚本。

Answer 3

更新的答案（见下面的评论）：

如果JS被阻止，您需要选择检测此内容并根据内容提供内容，即后端代码，或者使用其他策略，例如<noscript>。

原始答案：

这意味着我想隐藏的东西，直到有人点击某些东西必须用CSS显示然后用JS隐藏，

我总是从display:none或visibility:hidden开始（在其他地方看两者之间的差异），并使用JS来揭示元素。

Answer 4

有几种方法可以解决您的问题。您需要知道的是阻止内容和非阻止内容之间的区别。立即调用每个脚本和css（media = screen）。因此，如果你把一些css放在脑中，稍后用JavaScript附加一些东西，你很快就会以“非javascript”的方式看到它。

为了解决这个问题，你可以让对象的初始状态代表html / css，好像已经加载了JavaScript一样。（最理想的情况是你会有服务器端渲染，但对于更简单的站点，并不总是需要它）。此方法的缺点是，如果您有一个JavaScript错误阻止进一步执行，那么您的状态就会中断。如果你也忽略了少数几个已经禁用JS的人，你就可以保存并且渲染再看起来很好。此外！您可以通过异步加载脚本来改善站点性能。

如果您想要一种不同的方法，可以在您的html中添加className，例如<html class="noscript">。然后，当您加载所有JavaScript时，删除className。这样你只有一次重绘，它看起来是渐进的。但是这种方法有一个缺点，因为糟糕的性能变得越来越明显（因为你的浏览器第一次呈现以及JavaScript完成的时间可能需要一段时间）。所以通常这种方法不是首选（虽然看起来比非js / js禁用的浏览器更好）。

在加载css之前进行JavaScript样式更改的方法

4 个答案: