Un bookmarklet es un marcador almacenado en un navegador web que contiene comandos JavaScript que agregan nuevas funciones al navegador. Se almacenan como la URL de un marcador en un navegador web o como un hipervínculo en una página web . Los bookmarklets suelen ser pequeños fragmentos de JavaScript que se ejecutan cuando el usuario hace clic en ellos. Cuando se hace clic en ellos, los bookmarklets pueden realizar una amplia variedad de operaciones, como ejecutar una consulta de búsqueda a partir del texto seleccionado o extraer datos de una tabla.
Otro nombre para bookmarklet es favelet o favlet , derivado de favoritos (sinónimo de marcador). [1]
Steve Kangas de bookmarklets.com acuñó la palabra bookmarklet [2] cuando comenzó a crear scripts cortos basados en una sugerencia de la guía JavaScript de Netscape . [3] Antes de eso, Tantek Çelik llamó a estos guiones favelets y usó esa palabra ya el 6 de septiembre de 2001 (correo electrónico personal [ se necesita aclaración ] ). Brendan Eich , quien desarrolló JavaScript en Netscape, dio este relato sobre el origen de los bookmarklets:
Fueron una característica deliberada en este sentido: inventé la
javascript:
URL junto con JavaScript en 1995, y tenía la intención de quejavascript:
las URL pudieran usarse como cualquier otro tipo de URL, incluida la posibilidad de marcarlas como favoritas. En particular, hice posible generar un nuevo documento cargando, por ejemplojavascript:'hello, world'
, pero también (clave para bookmarklets) ejecutar un script arbitrario contra el DOM del documento actual, por ejemplojavascript:alert(document.links[0].href)
. La diferencia es que el último tipo de URL utiliza una expresión que se evalúa como el tipo indefinido en JS. Agregué el operador void a JS antes de que se lanzara Netscape 2 para que fuera más fácil descartar cualquier valor no definido en unajavascript:
URL.— Brendan Eich, en un correo electrónico a Simon Willison [4]
La mayor implementación de la Política de seguridad de contenido (CSP) en los sitios web ha causado problemas con la ejecución y el uso de los bookmarklets (2013-2015), [5] y algunos sugieren que esto anuncia el fin o la muerte de los bookmarklets. [6] [7] William Donnelly creó una solución alternativa para este problema (en el caso específico de cargar, hacer referencia y usar el código de la biblioteca JavaScript) a principios de 2015 utilizando un script de usuario de Greasemonkey ( extensión complementaria del navegador Firefox / Pale Moon ) y un protocolo de comunicación simple bookmarklet-userscript . [8] Permite ejecutar bookmarklets (basados en biblioteca) en todos y cada uno de los sitios web, incluidos aquellos que utilizan CSP y tienen un esquema URI https://. Sin embargo, tenga en cuenta que si/cuando los navegadores admitan deshabilitar/no permitir la ejecución de scripts en línea usando CSP, y si/cuando los sitios web comiencen a implementar esa característica, "romperá" esta "solución".
Los navegadores web utilizan URI para el href
atributo de la etiqueta y para los marcadores. El esquema de URI, como o , y que generalmente especifica el protocolo , determina el formato del resto de la cadena. Los navegadores también implementan URI que para un analizador son como cualquier otro URI. El navegador reconoce el esquema especificado y trata el resto de la cadena como un programa JavaScript que luego se ejecuta. El resultado de la expresión, si lo hay, se trata como el código fuente HTML de una nueva página que se muestra en lugar de la original.<a>
http
ftp
javascript:
javascript
El script en ejecución tiene acceso a la página actual, que puede inspeccionar y cambiar. Si el script devuelve un tipo indefinido (en lugar de, por ejemplo, una cadena), el navegador no cargará una página nueva, con el resultado de que el script simplemente se ejecuta en el contenido de la página actual. Esto permite cambios como el tamaño de fuente in situ y cambios de color sin tener que volver a cargar la página.
Una función invocada inmediatamente que no devuelve ningún valor o una expresión precedida por el void
operador impedirá que el navegador intente analizar el resultado de la evaluación como un fragmento de formato HTML:
javascript : ( función (){ //Declaraciones que devuelven un tipo no definido, por ejemplo, asignaciones})();
Los marcadores se guardan y utilizan como marcadores normales. Como tales, son herramientas sencillas de "un solo clic" que añaden funcionalidad al navegador. Por ejemplo, pueden:
"Instalar" un bookmarklet le permite acceder y ejecutar rápidamente programas JavaScript con un solo clic desde la barra de marcadores de su navegador. Siga estos pasos detallados para instalar un bookmarklet:
Ctrl+Shift+O
o seleccionando "Marcadores" en el menú del navegador y luego eligiendo "Administrador de marcadores".javascript:
seguido del fragmento de código.Para utilizar el bookmarklet, simplemente haga clic en su icono o nombre en su barra de marcadores. El código JavaScript se ejecutará inmediatamente en la página web actual que esté viendo. Asegúrese de que la página web esté completamente cargada antes de usar el bookmarklet para un rendimiento óptimo.
Este bookmarklet de ejemplo realiza una búsqueda en Wikipedia de cualquier texto resaltado en la ventana del navegador web. En uso normal, el siguiente código JavaScript se instalaría en un marcador en la barra de herramientas de marcadores del navegador [13] . A partir de ese momento, después de seleccionar cualquier texto, al hacer clic en el bookmarklet se realiza la búsqueda.
javascript : ( función () { función se ( re ) { regresar d . selección ? d . selección . crear rango (). texto : d . obtenerSelección () } var s = se ( documento ); for ( var i = 0 ; i < frames . length && ( s == null || s == '' ); i ++ ) s = se ( frames [ i ]. documento ); if ( ! s || s == '' ) s = solicitud ( 'Ingrese%20search%20terms%20for%20Wikipedia' , '' ); open ( 'https://en.wikipedia.org' + ( s ? '/w/index.php?title=Special:Search&search=' + encodeURIComponent ( s ) : '' )). enfocar (); })();
Los bookmarklets pueden modificar la ubicación , por ejemplo, para guardar una página web en Wayback Machine ,
javascript : ubicación . href = 'https://web.archive.org/save/' + documento . ubicación . href ;
Abra una nueva ventana o pestaña del navegador web , por ejemplo, para mostrar la fuente de un recurso web si el navegador web admite el esquema URI de fuente de visualización .
javascript : void ( ventana . abrir ( 'ver-fuente:' + ubicación ));
Mostrar información relacionada con la URL actual , por ejemplo,
javascript : alerta ( '\tdocument.URL\n' + documento . URL + '\n\tdocument.lastModified\n' + documento . lastModified + '\n\tubicación\n' + ubicación );
{{cite web}}
: Mantenimiento CS1: bot: estado de la URL original desconocido ( enlace )