function mostrarO(){ var clasetit= "ONP"; } function mostrarA(){ var clasetit= "AFP"; }
<h5 class="">Jubilación '+clasetit+'</h5> <button type="button" onclick="mostrarO()">ONP</button> <button type="button" onclick="mostrarA()" >AFP</button>
-
Deberías cambiar la propiedad innerText del elemento que estás queriendo cambiar, en este caso tu h5, te dejo este tutorial para que lo revises– Eduardo JiménezCommented el 25 oct. 2021 a las 4:46
2 respuestas
Aunque la respuesta de Daniel es correcta, no resuelve del todo la pregunta original.
Por lo que veo, estás intentando cambiar una parte del texto que hay en el h5, pero no todo. Eso puede resolverse de forma sencilla cambiando un poco la respuesta de Daniel.
function cambiarTexto(nuevoTexto) {
document.getElementById("texto").innerHTML = nuevoTexto;
}
<h5 class="">Jubilación <span id="texto">ONP</span></h5>
<button type="button" onclick="cambiarTexto('ONP')">ONP</button>
<button type="button" onclick="cambiarTexto('AFP')" >AFP</button>
Fíjate, la única diferencia es que, en vez de referirnos a todo el h5 desde el JavaScript, tan solo nos referimos al elemento span, por lo tanto, solo editamos el texto que hay entre esa etiqueta. Por lo tanto, desde el JavaScript, tan solo cambiaremos el tipo de jubilación, y no el texto entero "Jubilación AFP".
Pero he visto que tú, lo que quieres, es tener dos funciones que cambien el código. Para hacer eso, y usando el código de antes, quedaría así:
function mostrarO() {
document.getElementById("texto").innerHTML = "ONP";
}
function mostrarA() {
document.getElementById("texto").innerHTML = "AFP";
}
<h5 class="">Jubilación <span id="texto">ONP</span></h5>
<button type="button" onclick="cambiarA()">ONP</button>
<button type="button" onclick="cambiarB()" >AFP</button>
Te invito a leer el texto que @Eduardo Jiménez te puso en el comentario, es de la w3schools y lo explica bastante bien.
Ojalá te sirva, y si tienes dudas del funcionamiento, no dudes en preguntarme a mí o a Daniel.
-
No hay alguna forma que solo se pueda cambiar desde el javascript y agregar el evento onclick solo con el nombre de la función sin un parámetro adentro de los paréntesis? Commented el 25 oct. 2021 a las 15:15
-
-
-
function cambiarTexto(nuevoTexto) {
document.getElementById("texto").innerHTML = nuevoTexto;
}
<h5 id="texto" class="">Jubilación ONP</h5>
<button type="button" onclick="cambiarTexto('Jubilación ONP')">ONP</button>
<button type="button" onclick="cambiarTexto('Jubilación AFP')" >AFP</button>