返回

javascript-使用数组和按钮next更改文本

发布时间:2022-05-26 05:51:37 269
# 前端

问题是您在no_of_clicks每次运行函数时都定义siguiente,因此0每次单击时都会重置。如果您no_of_clicks退出该功能,它将按您的意愿工作。let此外,使用而const不是使用它是一种更好的做法,var因为它可以防止提升。我也从函数之外取出contenidoHistoria,因为它也不是你每次运行函数时都需要创建的东西。

var botonSiguiente = document.createElement('button')
botonSiguiente.setAttribute('id', 'siguiente')
botonSiguiente.innerText = 'Siguiente'
optionButtons = document.getElementById('option-buttons').appendChild(botonSiguiente)
document.getElementById('siguiente').addEventListener('click', siguiente, true)

//creating a 'sguiente' button event
var siguiente = function() {
var no_of_clicks = 0
//array that contains the infomration to pass everytime the button is clicked
var contenidoHistoria = ['texto 1', 'texto 2', 'texto 3', 'texto 4', 'texto 5']
var base = document.getElementById('base');
    base.innerHTML = `

${contenidoHistoria[no_of_clicks]}

`
no_of_clicks == (contenidoHistoria.length - 1) ? no_of_clicks = 0 : no_of_clicks = no_of_clicks + 1;

}
特别声明:以上内容(图片及文字)均为互联网收集或者用户上传发布,本站仅提供信息存储服务!如有侵权或有涉及法律问题请联系我们。
举报
评论区(0)
按点赞数排序
用户头像