📜  如何使用 JavaScript 创建 Show More 和 Show Less 功能以隐藏文本?

📅  最后修改于: 2021-08-31 02:14:38             🧑  作者: Mango

Show MoreShow Less功能在文本较多的网站中非常有用,例如在单个页面上包含大量文章的新闻和杂志网站。这可以帮助网页设计者根据需要让用户自由地阅读更多或更少的文本。

单击按钮可以更改显示的内容量。不是在网页上显示完整的段落,而是最初只显示文本的一部分,然后添加一个按钮来显示更多的文本。在他们点击按钮之前和之后应该显示的文本数量可以由开发人员决定。

上述方法可以通过使用一个简单的 if-else 条件来实现,该条件检查文本的当前状态并在此基础上显示或隐藏它。下面的例子说明了这个方法:

HTML


  

    

  

    

        GeeksforGeeks     

           

Show More and Show Less Example

       

        GeeksforGeeks was born out of necessity-         a need to provide a convenient and         one-stop educational portal to all the         students of Computer Science.         ...                      This necessity was             as personal to me as it was universal.             This need combined with my passion for             teaching resulted in GeeksforGeeks as             we know today. My message to you, in             our inaugural edition of Geeks Digest,             would be that if you are looking for             a problem to work on, you don’t need             to look very far for it. All you should             do is to look around yourself.              

                          


输出: