Marcador

Marcador del navegador web que contiene código JavaScript
Un navegador Firefox con un cuadro de diálogo que dice "Hay aproximadamente 2502 palabras en esta página".
Demostración de un bookmarklet que cuenta la cantidad de palabras de la página. El navegador que se muestra es Firefox 65.0.2 en Windows 10.

Un bookmarklet es un marcador almacenado en un navegador web que contiene comandos JavaScript que añaden 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. Al hacer 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]

Historia

Steve Kangas de bookmarklets.com acuñó la palabra bookmarklet [2] cuando comenzó a crear scripts cortos basados ​​en una sugerencia de la guía de JavaScript de Netscape . [3] Antes de eso, Tantek Çelik llamó a estos scripts favelets y utilizó esa palabra ya el 6 de septiembre de 2001 (correo electrónico personal [ aclaración necesaria ] ). Brendan Eich , quien desarrolló JavaScript en Netscape, dio esta explicación del origen de los bookmarklets:

En este sentido, fueron una característica deliberada: inventé la javascript:URL junto con JavaScript en 1995 y pretendí que javascript:las URL pudieran usarse como cualquier otro tipo de URL, incluso como marcadores. En particular, hice posible generar un nuevo documento cargando, por ejemplo, javascript:'hello, world', pero también (clave para los marcadores) ejecutar un script arbitrario contra el DOM del documento actual, por ejemplo javascript:alert(document.links[0].href). La diferencia es que el último tipo de URL usa una expresión que evalúa el tipo indefinido en JS. Agregué el operador void a JS antes de que se lanzara Netscape 2 para que fuera fácil descartar cualquier valor no indefinido en una javascript: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 sitios web ha causado problemas con la ejecución y el uso de 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 usando un userscript de Greasemonkey ( extensión complementaria del navegador Firefox / Pale Moon ) y un protocolo de comunicación bookmarklet-userscript simple . [8] Permite que los bookmarklets (basados ​​en la biblioteca) se ejecuten en todos y cada uno de los sitios web, incluidos aquellos que usan CSP y tienen un esquema de URI https://. Sin embargo, tenga en cuenta que si/cuando los navegadores admitan la desactivación/no permitir la ejecución de scripts en línea usando CSP, y si/cuando los sitios web comiencen a implementar esa función, "romperá" esta "solución".

Concepto

Los navegadores web utilizan URI para el hrefatributo 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 para una nueva página que se muestra en lugar de la original.<a>httpftpjavascript:javascript

El script que se está ejecutando tiene acceso a la página actual, que puede inspeccionar y modificar. Si el script devuelve un tipo indefinido (en lugar de, por ejemplo, una cadena), el navegador no cargará una nueva página, con el resultado de que el script simplemente se ejecuta sobre el contenido de la página actual. Esto permite realizar cambios como cambios de color y tamaño de fuente en el lugar sin tener que recargar la página.

Una función invocada inmediatamente que no devuelve ningún valor o una expresión precedida por el voidoperador impedirá que el navegador intente analizar el resultado de la evaluación como un fragmento de marcado HTML:

javascript : ( función (){ //Declaraciones que devuelven un tipo no indefinido, por ejemplo, asignaciones})();

Uso

Los bookmarklets se guardan y se utilizan como marcadores normales. Por lo tanto, son herramientas sencillas que se pueden usar con un solo clic y que añaden funcionalidad al navegador. Por ejemplo, pueden:

  • Modificar la apariencia de una página web dentro del navegador ( por ejemplo , cambiar el tamaño de fuente, el color de fondo, etc.)
  • Extraer datos de una página web ( por ejemplo , hipervínculos , imágenes , texto , etc.)
  • Eliminar redirecciones de los resultados de búsqueda (por ejemplo, Google) para mostrar la URL de destino real [9]
  • Envíe la página actual a un servicio de blogs como Posterous , un servicio de acortamiento de enlaces como bit.ly o un servicio de marcadores como Delicious
  • Consultar un motor de búsqueda o una enciclopedia en línea con texto resaltado o mediante un cuadro de diálogo
  • Enviar la página actual a un servicio de validación de enlaces o a un servicio de traducción
  • Establezca las opciones de configuración elegidas comúnmente cuando la página en sí no proporciona ninguna forma de hacerlo
  • Controla los parámetros de reproducción de audio y video HTML5 , como velocidad, posición, alternancia de bucle y visualización/ocultación de controles de reproducción, el primero de los cuales se puede ajustar más allá del rango de configuración típico de los reproductores HTML5. [10] [11] [12]

Instalación

"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:

Método 1: Crear un nuevo marcador

  1. Abra su navegador: inicie el navegador donde desea agregar el bookmarklet.
  2. Agregar un nuevo marcador:
    1. Vaya al administrador de marcadores. En la mayoría de los navegadores, puede acceder a él presionando Ctrl+Shift+Oo seleccionando "Marcadores" en el menú del navegador y luego eligiendo "Administrador de marcadores".
    2. Haga clic derecho en la barra de marcadores o en la carpeta donde desea agregar el bookmarklet y seleccione “Agregar nuevo marcador” o “Agregar página”.
  3. Configurar el marcador:
    1. En el campo 'Nombre', ingrese un nombre descriptivo para su bookmarklet para ayudarlo a identificar su función.
    2. En el campo 'URL', pegue el código JavaScript proporcionado para el bookmarklet. Asegúrese de que comience con javascript:seguido del fragmento de código.
  4. Guardar el marcador: haga clic en “Guardar” o “Listo” para agregar el bookmarklet a su barra o carpeta de marcadores.

Método 2: Arrastrar y soltar

  1. Localice el enlace del bookmarklet: busque el enlace del bookmarklet que se proporciona en una página web. Este enlace normalmente aparecerá como un botón en el que se puede hacer clic o un enlace etiquetado con la función del bookmarklet.
  2. Arrastre el Bookmarklet a su barra de marcadores:
    1. Haga clic y mantenga presionado el enlace del bookmarklet.
    2. Arrástrelo directamente a la barra de marcadores. Algunos navegadores pueden mostrar un marcador de posición o resaltar dónde se colocará el marcador.
    3. Suelte el botón del ratón para colocar el marcador en su lugar.
  3. Confirmación: El bookmarklet debería aparecer ahora en tu barra de marcadores, listo para usar.

Ejecutando el Bookmarklet

Para utilizar el bookmarklet, simplemente haga clic en su icono o nombre en la barra de marcadores. El código JavaScript se ejecutará inmediatamente en la página web que esté visualizando. Asegúrese de que la página web esté completamente cargada antes de utilizar el bookmarklet para obtener un rendimiento óptimo.

Consejos

  • Advertencia de seguridad: tenga cuidado al agregar marcadores de fuentes no confiables, ya que ejecutan código JavaScript que podría afectar potencialmente la seguridad o privacidad de su navegación.
  • Compatibilidad: si bien la mayoría de los navegadores modernos admiten marcadores, la funcionalidad puede variar. Consulte la documentación de su navegador para conocer las instrucciones o limitaciones específicas.

Ejemplo

Este bookmarklet de ejemplo realiza una búsqueda en Wikipedia sobre cualquier texto resaltado en la ventana del navegador web. En un uso normal, el siguiente código JavaScript se instalaría en un marcador en la barra de herramientas de marcadores de un 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 ( d ) {   devolver d .selección ? d .selección .createRange ( ) . text : d .getSelection ( )     } var s = se ( documento );    para ( var i = 0 ; i < frames.length && ( s == null || s == '' ) ; i ++ ) s = se ( frames [ i ] .documento ) ;            if ( ! s || s == '' ) s = prompt ( 'Ingrese%20términos%20de%20búsqueda%20para%20Wikipedia' , '' );       abierto ( 'https://en.wikipedia.org' + ( s ? '/w/index.php?title=Special:Search&search=' + encodeURIComponent ( s ) : '' )). foco ();        })();

Los marcadores 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 vista de fuente .

javascript : void ( ventana . open ( 'view-source:' + ubicación ));

Mostrar información relacionada con la URL actual , por ejemplo,

javascript : alert ( '\tdocumento.URL\n' + documento.URL + '\n\ tdocumento.lastModified \n' + documento.lastModified + '\n\tubicación\ n ' + ubicación ) ;

Referencias

  1. ^ Jonathan Avila (2014-03-02). «Cómo crear un favlet para pruebas de accesibilidad». Archivado desde el original el 2018-01-22 . Consultado el 2023-05-23 .{{cite web}}: CS1 maint: bot: estado de URL original desconocido ( enlace )
  2. ^ Dominio bookmarklets.com Archivado el 7 de julio de 2009 en Wayback Machine registrado el 9 de abril de 1998
  3. ^ "Activación de comandos JavaScript desde la barra de herramientas personal". Novedades de JavaScript 1.2 . Netscape Communications Corporation. 1997. Archivado desde el original el 11 de junio de 2002.
  4. ^ Willison, Simon (10 de abril de 2004). "Correo electrónico de Brendan Eich". SitePoint . Consultado el 26 de septiembre de 2014 .
  5. ^ "Error 866522 - Bookmarklets afectados por CSP".
  6. ^ "Los bookmarklets están muertos". 23 de octubre de 2014.
  7. ^ "La muerte lenta de los bookmarklets". 16 de noviembre de 2012.
  8. ^ "La resurrección de los bookmarklets".
  9. ^ Ruderman, Jesse. "Bookmarklets para eliminar las molestias". Sitio de Bookmarklets de Jesse . Consultado el 29 de marzo de 2013 .
  10. ^ "Marcadores de velocidad de vídeo de YouTube". sgeos.github.io . 2017-10-29.
  11. ^ Kant, Kushal (23 de agosto de 2017). "Cómo usar parámetros en etiquetas/atributos de video HTML5". findnerd .
  12. ^ "Etiqueta de vídeo HTML". www.w3schools.com .
  13. ^ Probado en Mozilla Firefox , Opera , Safari y Chrome . No funciona en IE7 ni IE8. Fuente original: Alex Boldt
  • Calishain, Tara (3 de febrero de 2004). "Bookmarklets Boost Web Surfing" (Los marcadores mejoran la navegación web). PC Magazine . Consultado el 31 de agosto de 2007 .
Obtenido de "https://es.wikipedia.org/w/index.php?title=Bookmarklet&oldid=1230348411"