¿Hay una manera fácil de incluir jQuery en la consola de JavaScript de Chrome para sitios que no lo usan? Por ejemplo, en un sitio web me gustaría obtener el número de filas en una tabla. Sé que esto es realmente fácil con jQuery.
$('element').length;
El sitio no usa jQuery. ¿Puedo agregarlo desde la línea de comando?
javascript
jquery
mrtsherman
fuente
fuente
document.getElementById('tableID').rows.length
. Si la tabla no tiene una ID, use el editor DOM para asignarle una. No necesitas jQuery para algo tan absurdamente trivial.Respuestas:
Ejecute esto en la consola de JavaScript de su navegador, entonces jQuery debería estar disponible ...
NOTA: si el sitio tiene scripts que entran en conflicto con jQuery (otras bibliotecas, etc.), aún podría tener problemas.
Actualizar:
Mejorar lo mejor, crear un marcador lo hace realmente conveniente, hagámoslo, y un pequeño comentario también es genial:
A continuación se muestra el código formateado:
Aquí se usa la URL oficial de jQuery CDN, siéntase libre de usar su propia CDN / versión.
fuente
chrome:flags
y verifique si está allí, deberá encenderlo.Ejecuta esto en tu consola
Crea una nueva etiqueta de script, la llena con jQuery y se agrega a la cabeza.
fuente
Copie todo de:
https://code.jquery.com/jquery-3.4.1.min.js
Y pégalo en la consola. Funciona perfectamente.
fuente
jQuery
o$
. Solo esta solución funcionó. Y luego, dado que no estoy usando la consola de registro de otra manera en estos días, siempre está en mi historial de comandos, por lo que después de la primera vez que copié el contenido, ahora solo necesito presionar la flecha hacia arriba y luego ingresar. Muy bien - graciasUse el folleto jQueryify:
http://marklets.com/jQuerify.aspx
En lugar de copiar y pegar el código en las otras respuestas, esto lo convertirá en un marcador en el que se puede hacer clic.
fuente
javascript:
antes.Content Security Policy: The page’s settings blocked the loading of a resource at https://code.jquery.com/jquery-latest.min.js (“script-src”).
Agregando a la respuesta de @ jondavidjohn, también podemos configurarlo como un marcador con URL como código de JavaScript.
Nombre: Incluir Jquery
Url:
y luego agregarlo a la barra de herramientas de Chrome o Firefox para que, en lugar de pegar el script una y otra vez, podamos hacer clic en el marcador.
fuente
jQuery.noConflict();
hizo parecer que no funcionaba en un sitio aleatorio en el que estaba probando esto. Resultó que ya tenían jQuery, pero su jQuery no tiene el$
acceso directo por alguna razón. Captura de pantalla: prntscr.com/bdcpdh .Soy un rebelde.
Solución: no use jQuery. jQuery es una biblioteca para abstraer las inconsistencias DOM en los navegadores. Como estás en tu propia consola, no necesitas este tipo de abstracción.
Por su ejemplo:
(
$$
es un alias paradocument.querySelectorAll
en la consola).Para cualquier otro ejemplo: estoy seguro de que puedo encontrar cualquier cosa. Especialmente si está utilizando un navegador moderno (Chrome, FF, Safari, Opera).
Además, saber cómo funciona el DOM no dañaría a nadie, solo aumentaría tu nivel de jQuery (sí, aprender más sobre JavaScript te hace mejor en jQuery).
fuente
sizzle
es mucho más potente que cualquiera de las llamadas nativas de JavaScript. Consultar por algo así$('div.className').children().hasClass('active').filter( function(index) { ... });
sería una pesadilla en JS.document.querySelectorAll('div.className .active').filter(function(index) {})
? : p[].slice.call( document.querySelectorAll('div.className .active') ).filter...
pero sí, el punto se destaca: si tienes un navegador moderno, dom es indoloro incluso sin jQuery. :):1
no es un pseudo selector. Tal vez quieres:first-child
?Acabo de hacer un jQuery 3.2.1 bookmarklet con manejo de errores (solo carga si aún no está cargado, detecta la versión si ya está cargada, mensaje de error si error al cargar). Probado en Chrome 27. No hay ninguna razón para usar el jQuery 1.9.1 "antiguo" en el navegador Chrome ya que jQuery 2.0 es compatible con API con 1.9 .
Simplemente ejecute lo siguiente en la consola de desarrollador de Chrome o arrástrelo y suéltelo en su barra de marcadores :
El código fuente legible está disponible aquí
fuente
La respuesta principal, de jondavidjohn, es buena, pero me gustaría modificarla para abordar un par de puntos:
http
una página enhttps
.jquery.com
el protocolo ahttps
resultados en una advertencia si lo prueba directamente desde la barra de URL del navegador:This is probably not the site you are looking for!
Mi único problema es que tengo que incluir un número de versión donde en la consola realmente siempre quiero la última.
fuente
Por esta respuesta :
Por alguna razón, tengo que ejecutarlo dos veces para obtener el nuevo '$' (que también tengo que ver con los otros métodos), pero funciona.
Este es el equivalente si su navegador no es tan moderno:
fuente
fetch('http://code.jquery.com/jquery-latest.min.js').then(response => response.text()).then(text => { eval(text); console.log($) })
. Espero que esto te ayude.fetch('http://code.jquery.com/jquery-latest.min.js').then(response => response.text()).then(text => { eval(text); eval(text) })
. Esta es una mejora definitiva sobre tener que hacerlo dos veces.Es bastante fácil hacer esto manualmente, como explican las otras respuestas. Pero también está el complemento jQuerify .
fuente
FWIW, Firebug incorpora el
include
comando especial, y jquery tiene un alias por defecto: https://getfirebug.com/wiki/index.php/IncludeEntonces, en su caso, solo tiene que escribir:
Florent
fuente
include("http://code.jquery.com/jquery-latest.min.js", "jquery")
por primera vez. Si soloinclude("jquery");
obtienes el errorAlias 'jquery' not found.
.include("jquery");
es para reutilizar la misma biblioteca en una pestaña / dominio diferente.include("jquery")
en la consola me da ese error.includeAliases.json
archivo (que contieneinclude()
alias) en su perfil de Firefox y eso debería funcionar.esta respuesta basada en @genesis answer, al principio probé la versión de marcador @jondavidjohn, y no funciona, así que la cambio a esta (agréguela a su marcador):
palabras de precaución, no se prueba en Chrome pero funciona en Firefox, y no se prueba en entornos de conflicto.
fuente
Una de las formas más cortas sería simplemente copiar y pegar el siguiente código en la consola.
fuente
Si está buscando hacer esto para un script de usuario, escribí esto: http://userscripts.org/scripts/show/123588
Le permitirá incluir jQuery, además de la interfaz de usuario y los complementos que desee. Lo estoy usando en un sitio que tiene 1.5.1 y no tiene interfaz de usuario; este script me da 1.7.1 en su lugar, más UI, y no hay conflictos en Chrome o FF. No he probado Opera yo mismo, pero otros me han dicho que también ha funcionado allí para ellos, por lo que esta debería ser una solución completa de script de usuario cruzado, si eso es lo que necesita hacer.
fuente
Aquí hay un código alternativo:
que se puede pegar directamente en la consola o crear una nueva página de marcadores (en Chrome, haga clic con el botón derecho en la barra de marcadores , Agregar página ... ) y pegue este código como URL.
Para probar si eso funcionó, ver más abajo.
Antes de:
Después:
fuente
Si desea utilizar jQuery con frecuencia desde la consola, puede escribir fácilmente un script de usuario. Primero, instale Tampermonkey si está en Chrome y Greasemonkey si está en Firefox. Escriba un simple script de usuario con una función de uso como esta:
fuente
Solución llave en mano:
Pon tu código en
yourCode_here
función. Y evite HTML sin etiqueta HEAD.fuente
Los navegadores modernos (probados en Chrome, Firefox, Safari) implementan algunas funciones auxiliares usando el signo de dólar
$
que son muy similares a jQuery (si el sitio web no define algo usandowindow.$
).Esas utilidades son bastante útiles para seleccionar elementos en el DOM y modificarlos.
Documentos: Chrome , Firefox
fuente
línea intuitiva
Puedes cambiar la
src
dirección.Me referí a ReferenceError: No puedo encontrar la variable: jQuery
fuente