当前位置：文江博客话题详情

如果禁用 javascript，如何在任何 X/HTML 元素上提供 css 样式？

发布于 2024-08-19 08:31:21 字数 78 浏览 4 评论 0原文

我想从外部 css 文件来做到这一点。我在主 css 中有一个 div#abc，但我想仅在禁用 javascript 时设置此 div 不显示

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

音盲 2024-08-26 08:31:21

怎么样

<noscript>
  <style type="text/css">
  div#abc { display: none; }
  </style>
</noscript>

？如果您确实想在外部 CSS 文件中执行此操作，请将其移至 no_js.css 中，并在 link 元素（而不是 style 属性）中引用该文件。

然而，大多数情况下，反过来更方便：设置禁用 JS 的默认值，然后让 JS 更改类名（例如）以更新样式。 jQuery 示例：

$(document).ready(function () {
  $('.fancy_user_interface_element').addClass('additional_js_style_class');
});

How about

<noscript>
  <style type="text/css">
  div#abc { display: none; }
  </style>
</noscript>

? If you really want to do it in an external CSS file, move this into no_js.css and reference this file in a link element instead of the style attribute.

Mostly however, it is more convenient to go the other way round: Set the defaults for disabled JS and then let JS change class names (for example) to update the style. jQuery example:

$(document).ready(function () {
  $('.fancy_user_interface_element').addClass('additional_js_style_class');
});

回复收藏 0 原文

生生不灭 2024-08-26 08:31:21

我会让 div style="display: none;"默认情况下，然后用 javascript 显示它。

<div id="abc" style="display: none;">
 ...
</div>

<script type="text/javascript">
    $(function() {
        $('#abc').show();  //using jQuery
    });
</script>

这样，如果您没有启用 javascript，则不会显示该 div。我已经使用内联 CSS 展示了它，但您也可以使用 CSS 类来实现它，并且只需从元素中删除该类即可。

 <style>
    .requires-javascript { display: none; }
 </style>

 <div id="abc" class="requires-javascript">
     ...
 </div>

 <script type="text/javascript">
     $(function(){
         $('.requires-javascript').removeClass('requires-javascript');
     });
 </script>

这种方式将使其能够使用单个 jQuery 语句来处理页面上需要 JavaScript 的所有元素。

I would make the div style="display: none;" by default then show it with javascript.

<div id="abc" style="display: none;">
 ...
</div>

<script type="text/javascript">
    $(function() {
        $('#abc').show();  //using jQuery
    });
</script>

This way, if you don't have javascript enabled, the div won't be shown. I've shown it using inline CSS but you could also do it with a CSS class and simply remove the class from the element.

 <style>
    .requires-javascript { display: none; }
 </style>

 <div id="abc" class="requires-javascript">
     ...
 </div>

 <script type="text/javascript">
     $(function(){
         $('.requires-javascript').removeClass('requires-javascript');
     });
 </script>

This way would make it work with a single jQuery statement for all elements on the page that require javascript.

回复收藏 0 原文