JavaScriptGuiones de JavaScript *
JavaScriptGuiones e información sobre JavaScript
GuionesÍndice de guiones ("scripts") de JavaScript Los últimosÚltimos guiones ("scripts") incorporados o modificados Los más vistosGuiones ("scripts") más visitados
ArtículosArtículos y apuntes sobre JavaScript Prensa digitalJavaScript en la prensa digital
InternetJuan Rodríguez, consultor
Consultoría en Internet
ContactarPor si quieres escribirnos...
*
Mapa WebMapa Web (Directorio) de nuestros contenidos sobre JavaScript << Menú >>
Juan Rodríguez, consultor Guiones (scripts) de JavaScript
Estás en: Juan Rodríguez, web personal > JavaScript > Índice de guiones > Cambiar texto pulsando un botón <

Cambiar texto pulsando un botón (onClick)

Verificado en:

Opera 9.02 y 9.20
Opera 6.05, 7 y 8
Firefox 1.5, 3.0b5 y 3.0.6
Mozilla 1.8
Netscape 7
Internet Explorer 6 y 7

Opera web browser

Permite cambiar el texto (o gráfico) visible en pantalla cada vez que se pulse un botón, mostrando diferentes textos.

Si sólo se programan dos textos se producirá un efecto de alternancia entre ambos. Inicialmente no muestra nada.

De programarse dos textos es útil en situaciones de on/off, entrar/salir, si/no, etc.

El número de botones es optativo. En el ejemplo hay dos.

Ejemplo de aplicación de este guión

Ejecutar Instalación Ver código Descargar + guiones

Código en las cabeceras (head) de la página

<script type="text/javascript">
<!-- inicio
var contador=0;
function tecla(elem) {
document.getElementById(elem+contador).style.visibility = 'visible';
// En la siguiente línea la variable contador ha de ser igual al máximo de textos a mostrar
contador = ++contador % 4;
document.getElementById(elem+contador).style.visibility = 'hidden'; }
// final -->
</script>

Código en el cuerpo (body) de la página

<script type="text/javascript">
<!-- inicio
<table>
<tr><td><input type="button" onclick="tecla('t');" value="Pulsar para ver el efecto"></td></tr>
<tr><td>
<p id="t0" style="visibility:hidden"><b>www.castefa.net</b></p>
<p id="t1" style="visibility:hidden">Empresas, profesionales y comercios.</p>
<p id="t2" style="visibility:hidden">Actualidad, empleo, mapas y callejero.</p>
<p id="t3" style="visibility:hidden">Visítalo en <a href="http://www.castefa.net" title="Directorio de Castelldefels (Barcelona)">Directorio de Castelldefels</a></p>
</td></tr>
<tr><td><input type="button" onclick="tecla('t');" value="Pulsar para ver el efecto"></td></tr>
</table>
// final -->
</script>

javascriptCambiar texto pulsando un botón (onClick)

Juan Rodríguez, consultor

Cuidar de nuestro entorno natural,
puede y debe ser cosa de todos.

Por ejemplo, no gastando papel para
imprimir una información que siempre
puedes tener en la pantalla de tu pc.
- -

Guiones y "scripts" de JavaScript

Juan Rodríguez, consultor
Castelldefels (Barcelona)