有没有办法动态更改内容没有javascript？ [英] Is there a way to dynamically change content without javascript?

问题描述

我正在建立一个工作页面，其中包含内容需要在按钮点击时动态更改的部分。我知道几种不同的方式来完成这一切，但所有的这些都涉及到某种类型的JavaScript。我的能力目前不包括为这个网站编写脚本，所以我正在研究，看看是否有一个方法来做这与JUST CSS，在我通知我的项目经理，我们的一个javascript家伙将必须处理它。

I am building out a page for work that has a section where the content needs to change dynamically on button(s) click. I know of several different ways to accomplish this but all of them involve javascript of some kind or another. My capabilities don't currently include writing script for this site so I am researching to see if there is a way to do this with JUST css before I inform my project manager that one of our javascript guys will have to handle it. So, anyone know of any cool CSS techniques that might get the desired effect?

推荐答案

你可以使用CSS的 ：target 伪类选择器。这将需要用 a 元素替换您的按钮，这会导致您的文档的URL应用与 id

You could potentially use CSS's :target pseudo-class selector. This would require replacing your buttons with a elements instead, which cause your document's URL to apply a hash relating to the id attribute of the element you want to change.

div {
  display: none;
}

:target {
  display: block;
}

<a href="#foo">Click here to show the hidden <code>div</code> element</a><br>
<a href="#">Click here to hide it again</a>.
<div id="foo">This should only show when the link is clicked.</div>

这篇关于有没有办法动态更改内容没有javascript？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！