在纯 html 环境中显示/隐藏文本

Question

这个问题困扰了我多年。在纯 HTML 环境中，您如何正确创建内联“显示更多文本”/“显示更少文本”按钮。纯 HTML 环境流行于编辑维基或降价文件等地方。

<details>

标签几乎就是我想要的。除了它添加了两个额外的不需要的换行符。

<p>
 I want this text on the same line
  <details>
   <summary>as this text</summary>
  and this text</details>
</p>

如果有一个“否定换行符”字符，我可以删除

<details>

标签添加的额外换行符，但我认为这样的事情不存在。

此链接来自this post显示如何使用

display: inline-block

删除两个换行符之一。但是它需要使用 CSS。

此链接 显示了如何使显示更多显示更少按钮。但它要求您为每个按钮制作唯一的 ID，这对于大页面来说是不可行的。还有一些 wiki 不允许您使用函数。

我可以让“正文”成为

<details>

的

<summary>

文本。但在项目符号列表等环境中，它将创建项目符号、新行、正文、新行、.

似乎没有一个只有 HTML 的答案，这看起来简单得令人沮丧。

Answer 1

HTML 不是环境，也不是编程语言。它是一种在 TCP（HTTP）通信中构建信息的协议。

以非常非常具体的方式，HTTP 确实是协议，HTML 是构建协议的标记语言，但不是编程语言。

CSS 是 HTML 的一部分，作为设计该文档表示的基本协议。协议中没有“隐藏”之类的东西，该文档的表示中有“隐藏”之类的东西，所以这是 CSS 而不是 HTML 的主要原因。