Решение, как спрятать текст под спойлер с помощью чистого JavaScript без jQuery и прочих плагинов.
Демонстрация
В любом месте странички размещаем код скрипта:
<script> function Spoiler() { var ele = document.getElementById("contentSpoiler"); var text = document.getElementById("linkSpoiler"); if(ele.style.display == "block") { ele.style.display = "none"; text.innerHTML = "Подробнее"; } else { ele.style.display = "block"; text.innerHTML = "Скрыть"; } } </script>
Это код кнопки, по клику развернётся текст:
<a href="javascript:Spoiler();" class="link_spoiler" id="linkSpoiler">Подробнее</a>
Это контейнер с текстом, по умолчанию он скрыт:
<div id="contentSpoiler" style="display: none;"> <p>Однако политические учения Гоббса иллюстрирует современный англо-американский тип политической культуры. Капиталистическое мировое общество случайно. Политическое учение Августина доказывает коллапс Советского Союза. Социализм символизирует либерализм, указывает в своем исследовании К.Поппер. Идея правового государства, как бы это ни казалось парадоксальным, традиционно вызывает антропологический коллапс Советского Союза, что неминуемо повлечет эскалацию напряжения в стране. Международная политика иллюстрирует гносеологический либерализм.</p> </div>
<a href="javascript:Spoiler(1);" class="link_spoiler" id="linkSpoiler1">Подробнее</a> <div id="contentSpoiler1" style="display: none;"> <p>1111111111</p> </div> <br> <a href="javascript:Spoiler(2);" class="link_spoiler" id="linkSpoiler2">Подробнее</a> <div id="contentSpoiler2" style="display: none;"> <p>2222222222</p> </div> <script> function Spoiler(ID) { var ele = document.getElementById("contentSpoiler"+ID); alert(ele); var text = document.getElementById("linkSpoiler"+ID); if(ele.style.display == "block") { ele.style.display = "none"; text.innerHTML = "Подробнее"; } else { ele.style.display = "block"; text.innerHTML = "Скрыть"; } } </script>