使用原生querySelectorAll和forEach来实现点击切换
<style>.mantine-text { display: none; }
</style>
<div class="inner">
<div class="mantine-text">TEXT 111111</div>
<div class="mantine-button">BUTTON</div>
</div>
<div class="inner">
<div class="mantine-text">TEXT 22222</div>
<div class="mantine-button">BUTTON</div>
</div>
<div class="inner">
<div class="mantine-text">TEXT 3333</div>
<div class="mantine-button">BUTTON</div>
</div>
<script>
[].forEach.call(document.querySelectorAll(".inner .mantine-button"), function(item,index,input){
console.log(index);
item.addEventListener('click', function(event) {
event.preventDefault();
if (document.querySelectorAll(".inner .mantine-text").item(index).style.display === 'inherit') {
document.querySelectorAll(".inner .mantine-text").item(index).style.display= 'none';
}else{
document.querySelectorAll(".inner .mantine-text").item(index).style.display= 'inherit';
}
}
)
});
</script>
页:
[1]