Javascript HTML5详细信息->；总结

这是一个非常基本的问题

我使用的是HTML5的详细信息，我想知道在点击时是否可以更改摘要

即

摘要显示“显示更多”，但我想知道是否有一种方法可以让它在单击并显示详细信息后显示“显示较少”

<details>
   <summary>Show more</summary>
   <p>Content></p>
</details>

显示更多
内容>

用jquery试试这个

var clicked=false;
    $("summary").click(function(){
    if(!clicked){
   clicked=true;
    this.html("show less");
    }else{
   clicked=false;
   this.html("show more");
   }
    });

没有jquery

       var clicked=false;
        var a=document.getElementsByTagName('summary')[0];
        a.addEventListener('click',function(){
        if(!clicked){
        clicked=true;
        a.innerHTML="show less";
       }   else{
   clicked=false;
        a.innerHTML="show more";
        }
        },false);

---

不是简单的HTML，而是JavaScript（JQuery）

您可以通过在上述代码之前添加链接到其CDN的标记，将jquery添加到页面中

<script src="http://codeorigin.jquery.com/jquery-2.0.3.min.js"></script>

对不起，我的错。这是一个简单的解决方案。应该注意，这需要jquery，因为OP没有说他正在使用jquery。虽然我从来没有任何理由避免使用jquery，因为它已经在应用程序的某些部分中使用过，但我只是好奇是否有一个HTML5唯一的选项可以这样做。谢谢大家！虽然我从来没有任何理由避免jquery，因为它已经在应用程序的某些部分中使用过，但我只是好奇是否有一个HTML5唯一的选项可以做到这一点。谢谢大家！

<script src="http://codeorigin.jquery.com/jquery-2.0.3.min.js"></script>