Javascript 在HTML中动态移动元素和创建新元素

我有一个虚构的网站，看起来像下面的截图。我想要一个动态元素，例如，当点击过滤器和搜索属性链接时，它下面的代理首选项链接会在页面上向下移动，新项目会出现，为用户提供更多选项（可能只是几个额外的按钮，或者可能是一个勾选框等），而无需重新加载整个页面

这是否可能仅使用HTML，还是始终有javascript元素？我在各种网站上看到的半透明的“弹出窗口”也是如此吗？我并不特别讨厌Javascript，但我想知道这通常是如何实现的

---

是的，通常只要您想要动态内容，就必须使用Javascript。随着许多令人敬畏的web技术（HTML5、CSS3等）的最新进展，过去只能用其他语言实现的许多功能都可以实现，但您将牺牲兼容性（只有较新的浏览器才能支持这些较新的功能）

是的，您只需使用Javascript、HTML和CSS就可以拥有动态内容，我使用了下面的

函数showHidden（）

来实现这一点

如果不直观，单击“单击我”，您将看到一个元素弹出

您将注意到该元素已经存在，并且在按下按钮之前一直处于隐藏状态。这是一种方法。另一个正在添加到列表中

---

拥有JQUery会很好，使用它您将能够更有效地操作DOM

如果你想在点击链接时显示额外的元素，你可以先创建这些元素，然后用CSS

display:none隐藏它们。单击该链接时，调用JavaScript函数（
onclick=“myFunction（）；”
）。该函数应使用
document.getElementsByCassName（“yourClass”）
获取隐藏元素的类，使用
for
循环这些元素，并将它们设置为
显示：inline
。
有了jQuery，这就更容易了。您可以使
onclick=“$（'.yourClass'）.show（）；

要使事物透明，请设置CSS属性
opacity:X；
，其中X是介于0和1之间的值（0=完全不可见，1=完全不透明）

以下是HTML、CSS和JS的完整示例：

<style>
.hidden {display: none;}
</style>

<button class="hidden">This is hidden for now</button>
<button onclick="$('.hidden').show();">This button will make the first button appear</button>


.hidden{显示：无；}
这是暂时隐藏的
此按钮将显示第一个按钮

p、 美国：你必须包含jQuery库才能使上述示例正常工作。
我所知道的实现这一点的最简单方法是使用simple JS，在单击时更改CSS显示属性。我不知道单独在HTML上实现这一点的方法，但我想告诉你我的意思：

  <ul>
     <li onClick="viewOptions('furtherOptions')">Filter and Search Properties</li>
       <div id="furtherOptions" style="display: none">
         <ul>
            <li>Option</li>
         <ul>
        </div>
       </li>
     </ul>

它将找到您传递给它的id元素，并将其CSS更改为block，以使其可见

当然，您必须了解更多细节，例如在打开新文件时关闭已展开的文件等。要再次隐藏文件，您也可以这样做，但添加“无”而不是“块”

抱歉，我知道你说你想要一个HTML答案，但正如我说的，我不知道有一个。
你需要使用javascript或jQuery（一个javascript库）。@AlienArrays该网站上有多么棒的一个集合！我将调查。。。
function viewOptions(varWhichOptions) {
   document.getElementByID(varWhichOptions).style.display = "block";
 }