“Cara membuat runtuh menggunakan javascript murni” Kode Jawaban

Cara membuat runtuh menggunakan javascript murni

const collapsableBtn = document.querySelectorAll('.collapsable-toggle');

for (let index = 0; index < collapsableBtn.length; index++) {
    collapsableBtn[index].addEventListener('click', function(e) {
        // e.preventDefault();
        e.stopImmediatePropagation();

        iterateElement = this;

        getCollapsableParent = iterateElement.parentElement;

        if(getCollapsableParent.classList.contains('show')) {
            getCollapsableParent.classList.remove('show')
            iterateElement.innerText = iterateElement.getAttribute('data-onCloseText');

        } else {
            getCollapsableParent.classList.add('show');
            iterateElement.innerText = iterateElement.getAttribute('data-onOpenText');
        }
    })
}
Concerned Cormorant

Cara membuat runtuh menggunakan javascript murni

<div class="collapsable-container">
    <a href="javascript:void(0);" class="collapsable-toggle" data-onOpenText="Hide First Content" data-onCloseText="Show First Content">Show First Content</a>
    <div id="expand">
        This is some Content
    </div>
 </div>
 
 
 <div class="collapsable-container">
    <a href="javascript:void(0);" class="collapsable-toggle" data-onOpenText="Hide Second Content" data-onCloseText="Show Second Content">Show Second Content</a>
    <div id="expand">
        This is some Content
    </div>
 </div>
Concerned Cormorant

Cara membuat runtuh menggunakan javascript murni

.collapsable-container #expand {
   display:none;
}
.collapsable-container.show #expand {
    display:block;
}
Concerned Cormorant

Jawaban yang mirip dengan “Cara membuat runtuh menggunakan javascript murni”

Pertanyaan yang mirip dengan “Cara membuat runtuh menggunakan javascript murni”

Lebih banyak jawaban terkait untuk “Cara membuat runtuh menggunakan javascript murni” di HTML

Jelajahi jawaban kode populer menurut bahasa

Jelajahi bahasa kode lainnya