【问题标题】:How does expand and collapse work on w3.org? [closed]w3.org 上的展开和折叠如何工作? [关闭]
【发布时间】:2014-05-14 14:42:12
【问题描述】:

查看此列表w3.org expand and collapse,他们如何在这里进行展开和折叠魔法?

我知道如何使用 javascript 来做到这一点,但似乎他们没有使用 javascript,至少从我观察到的情况来看是这样。

【问题讨论】:

  • 你观察错了,他们添加和删除了一个名为“关闭”的类。如果您检查其中任何一个元素,然后打开和关闭列表,您会看到它。
  • 我已经看过了.. 只是无法弄清楚与切换相关的代码在哪里,所以我只是断定他们没有使用 javascript...@lan

标签: javascript html css


【解决方案1】:

你怎么能说他们没有使用javascript,右键单击chrome中的页面,选择查看源并滚动到底部,你会看到这个:-

 <script type="text/javascript" src="/2008/site/js/main" xml:space="preserve"><!-- --></script>

还要注意每个 div 都有一个分配的 id,它可以用来在 JS 中唯一地指向每个元素,这表明它们实际上正在使用 JS 来实现这些效果。

【讨论】:

  • 你能指出他们具体使用的是哪个代码段吗?我根本想不通。我知道它们包含了一些 js 文件,但我没有看到脚本的哪一部分执行了展开/折叠技巧。
  • 这可能是不可能的,他们使用的是外部 JS 文件并且没有将代码直接输入到网页中。外部文件似乎被混淆了(最小化 - 这意味着在删除空格并重命名变量以使其非用户可读的情况下减小大小)。这是JS文件w3.org/2008/site/js/main的链接,我不希望你能从中看出。
  • 顺便说一句,展开和折叠元素并没有什么魔力,它简单的 Javascript 事件和修改元素的显示属性,为了更好地理解,请参阅这里提供的各种 js 教程,如 ehow.com/how_8594746_expand-section-javascript.html
猜你喜欢
  • 2019-05-27
  • 1970-01-01
  • 2012-06-20
  • 2014-11-03
  • 2018-12-13
  • 2013-06-06
  • 2020-01-30
  • 1970-01-01
相关资源
最近更新 更多