您好,登錄后才能下訂單哦!
小編給大家分享一下JS怎么實現點擊循環切換顯示內容,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
1、js屬于一種解釋性腳本語言;2、在絕大多數瀏覽器的支持下,js可以在多種平臺下運行,擁有著跨平臺特性;3、js屬于一種弱類型腳本語言,對使用的數據類型未做出嚴格的要求,能夠進行類型轉換,簡單又容易上手;4、js語言安全性高,只能通過瀏覽器實現信息瀏覽或動態交互,從而有效地防止數據的丟失;5、基于對象的腳本語言,js不僅可以創建對象,也能使用現有的對象。
JS實現點擊循環切換顯示內容的方法,具體如下:
先來看看運行效果:
具體代碼如下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>www.jb51.net 點擊循環切換內容</title> <style> a { cursor: pointer; color: red; } p { display: none; } </style> </head> <body> <a onclick="con()">循環切換內容</a> <p>11111</p> <p>22222</p> <p>33333</p> <script> //可以換成切換圖片等等 flag = 0; pre = 0; function con(){ var cons = document.getElementsByTagName("p"); document.getElementsByTagName("p")[pre].style.display = "none"; document.getElementsByTagName("p")[flag].style.display = "inline"; console.log(flag); pre = flag; if(flag == cons.length - 1) { //注意是cons.length-1,因為索引值是從0開始的 flag = 0; } else { ++flag; } } </script> </body> </html>
以上是“JS怎么實現點擊循環切換顯示內容”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。