JavaScript:可以动态加载整个页面吗?

时间:2016-02-26 17:14:22

标签: javascript html

当我尝试在禁用JavaScript的情况下访问Gmail和FaceBook时,我会收到以下信息:

Gmail, sans JS

FB, sans JS

图片中的内容显示在<noscript>标签中,但其他常用页面内容不在此处。 Gmail来源有一些空的<iframe>元素,但FB页面为空,除了<noscript>元素和一对<script>标记。

我希望我的网站有类似的行为,但我不确定如何只加载页面内容如果用户启用了JS。我可以放入<noscript>元素,并在屏幕上设置一个带有&#34的div;你需要启用JS&#34;消息,但其余的内容仍然会加载到它后面。

有几个解决方案herehere,但它们只包含以下主要内容:

display: none;

并通过JS将其设置为block;。但这仍然会出现在消息来源中。

我可以完全阻止在禁用JS时加载页面内容,并且只显示&#34;糟糕,你需要启用JS&#34;消息?

2 个答案:

答案 0 :(得分:1)

不要将内容放在第一页中,只需添加<script src="…">即可通过AJAX加载实际内容。然后,您的来源应该大致遵循该模板:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script src="libraries.js"></script>
<script src="load-page-contents.js"></script>
</head>
<body>
<noscript>
  This website is an interactive editor for 3D graphics or something
  really complex that can't be done at all in plain HTML, and therefore
  needs JavaScript.
  Click here to read more <a href="about.html">about this project</a>.
  <img src="screenshot.jpg" alt="Obligatory screenshot, to compell the
    user to turn on JavaScript because this looks So Cool ™." />
</body>
</html>

然而,请三思而后行。您的网站真的是否需要使用JavaScript?否则至少会显示一个愚蠢的版本?禁用JavaScript有很多原因(屏幕阅读器,搜索引擎,安全问题,轻松禁用大量闪烁的令人讨厌的广告)

答案 1 :(得分:0)

只需使用AJAX请求加载整个页面,然后使用Javascript隐藏错误消息。如果他们禁用了Javascript,则会保留错误消息,如果已启用该页面,则会加载该页面。