Modificar los atributos desde jQuery
Desde jQuery, podemos modificar a nuestro gusto cualquier valor de cualquier etiqueta de un documento DOM en tiempo de ejecución. Primero debemos identificar el objeto, ya sea por medio de un identificador, etiqueta o clase, y luego utilizar el método attr().Si el selector regresa más de un elemento, sólo se modificará el primero.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Atributos</title>
<script src="jquery.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(inicio);
function inicio(){
$("#chica").click(onChica);
$("#mediana").click(onMediana);
$("#grande").click(onGrande);
$("#titulo").click(onTitulo);
}
function onChica(){
$("img").attr({width:"160px", height:"196px"});
}
function onMediana(){
$("img").attr({width:"320px", height:"392px"});
}
function onGrande(){
$("img").attr({width:"480px", height:"588px"});
}
function onTitulo(){
var titulo = $("img").attr("title");
$("#texto").text(titulo);
}
</script>
</head>
<body>
<input id="chica" type="button" value="Chica">
<input id="mediana" type="button" value="Mediana">
<input id="grande" type="button" value="Grande">
<input id="titulo" type="button" value="Titulo">
<br>
<img src="imagenes/afrodita160x196.jpg" width="160" height="196" alt="Afrodita" title="El nacimiento de Venus, William-Adolphe Bouguereau, 1879">
<p id="texto"></p>
</body>
</html>
Ejemplo: http://pacoarce.com/jQuery/Atributos.html
Curso completo: https://www.udemy.com/jquery-y-mobile/
No hay comentarios:
Publicar un comentario