[GreaseMonkey] Busco tutorial en español o ayuda

Iniciado por MilorES, 30 Septiembre 2012, 18:44 PM

0 Miembros y 1 Visitante están viendo este tema.

MilorES

En principio quería hacer algo sencillo, tengo un web que tiene varios css pero solo muestra uno dependiendo de como te registras (no se puede cambiar).

Me gustaría cambiárselo, el problema es que la etiquet <link> no contiene el id.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="es" xml:lang="es" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Asgard</title>
<link href="favicon.ico" rel="shortcut icon">
<link href="/estilos/3.css" type="text/css" rel="STYLESHEET">


Me interesa cambiar la ultima linia (luego aprendiendo como hacer eso seguro que sabría hacer el cambio de imagenes) quiero poner en vez de un 3 un 5.

Esto se debería hacer con un script para greasemonkey de lado del cliente. (No puedo tocar nada del servidor, como es normal)

~ Yoya ~

DOM

Para este tipo de cosas, es necesario utilizar javascript. Aprende las cosas básicas, que ya es algo genérico en todos los lenguajes, imprimir en pantalla, toma de decisiones, etc..

Luego lee sobre DOM, y te recomiendo que en ese momento comiences a utilizar algun framework para javascript, como puede ser la famosa librería Jquery. La razon, es que todavia no hay un estandar y para ahorrarte tiempo de escribir lineas y lineas, para que funcione en todos los navegadores, mejor utiliza un Framework para que no te preocupes por la compatibilidad en los diferentes navegadores.

Bueno, la solucion aqui, cuando aplicas todos los conocimientos mencionados.
Código (html4strict,4,5,6,7,8,9,10) [Seleccionar]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="es" xml:lang="es" xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script>
$(document).ready(function() {
$('html head link:eq(1)').attr('href','/estilos/5.css');
});

</script>



<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Asgard</title>
<link href="favicon.ico" rel="shortcut icon">
<link href="/estilos/3.css" type="text/css" rel="STYLESHEET">


Saludos.
Mi madre me dijo que estoy destinado a ser pobre toda la vida.
Engineering is the art of balancing the benefits and drawbacks of any approach.

MilorES

Si tengo pensado aprender como funciona el DOM de una vez y luego algo de javascript (y siempre tirar de un framework)

Pero yo necesito usar greasemonkey crear un script para él, no puedo cambiarle el código fuente a la web.

Deduzco que eso no me vale.

~ Yoya ~

Como que no, solo tienes que agregar Jquery en el UserScript. y Agregar esto:
Código (javascript) [Seleccionar]
$(document).ready(function() { $('html head link:eq(1)').attr('href','/estilos/5.css');});

Primero que nada, lee la documentación de Greasemonkey para que sepas como agregar archivos javascript. Hasta hay llego, yo no te creare el UserScript.
Mi madre me dijo que estoy destinado a ser pobre toda la vida.
Engineering is the art of balancing the benefits and drawbacks of any approach.

MilorES

#4
Gracias, aunque no funciona del todo bien, si cambia el css (lo veo en el código fuente), pero se queda cargando :O

Añadiendo a la cabecera del script:
// @grant       GM_getValue
// @grant       GM_setValue

después del:

// @require     http://code.jquery.com/jquery-1.8.2.min.js

parece que perfecto.

Ahora a mirar el tema de la imágenes, supongo que solo debo redactar esa función :D

Gracias.