El interprete de linea de comando

Puedes ejecutar expresiones JavaScript en tiempo real usando la linea de comando de la Web Console.

Introduciendo expresiones

Para introducir expresiones solo tipeela en la linea de comando y presione  Enter. Para ingresar expresiones multilinea, use Shift+Enter en vez de Enter.

La expresión que escriba se mostrará en la ventana de visualización de mensaje, seguida por el resultado:

Nuevo en Firefox 47

Desde Firefox 47 en adelante, si su entrada no parece estar completa cuando presiona Enter, entonces intente presionar Shift+Enter en la consola, para terminar el ingreso.

Por ejemplo, si usted escribe:

function foo() {

y luego presiona Enter, la consola no ejecutara inmediatamente lo ingresado, pero se comportara como si hubiese presionado Shift+Enter , para que pueda finalizar el ingreso de la definicion de funcion.

Acceso a variables

Puede acceder a variables definidas en la pagina, ya sean built-in como ser window y variables agregadas por JavaScript como jQuery

Autocompletar

La linea de comando tiene autocompletar: ingrese alguna letras y un popup aparecerá con las opciones posibles:

Presione Enter o  Tab para aceptar la sugerencia, use las flechas arriba/abajo para moverse a las diferentes sugerencias, or solo continue escribiendo si las sugerencias no son las que necesita.

La consola sugiere opciones del scope del stack frame en ejecucion. Esto significa que si has alcanzado un breakpoint en la función obtendrás sugerencias de autocompletado de los objectos locales de la función.

Tambien obtendrás sugerencias de autocompletar para elementos array:

Definicion de  variables

Puedes definir tus propias variables y acceder a ellas:

Historial de Comandos

La linea de comando recuerda lo que ingresaste: para movernes atras o adelante en el historial, usa las flechas arriba y abajo.

Desde Firefox 39 en adelante, el historial se mantiene en todas de las sesiones. Para eliminar el historial, use la función helper clearHistory().

Trabajando con iframes

Si la pagina contiene iframes embebidos, puede usar el comando cd() para cambiar el scope de la consola a un iframe específico, luego podra ejecutar las funciones definidas en el documento hosteado por el iframe. Hay tres formas de seleccionar un iframe usando cd():

Puedes pasarle el elemento DOM del iframe:

var frame = document.getElementById("frame1");
cd(frame);

Pasando el selector CSS que coincida con el iframe:

cd("#frame1");

Pasando el objeto global iframe:

var frame = document.getElementById("frame1");
cd(frame.contentWindow);

Para cambiar al contexto del nivel superior de window, use cd()sin argumentos:

cd();

Por ejemplo, supongamos que tenemos un documento embebido en un iframe:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
  </head>
  <body>
    <iframe id="frame1" src="static/frame/my-frame1.html"></iframe>
  </body>
</html>

El iframe define una nueva función:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <script>
      function whoAreYou() {
        return "I'm frame1";
      }
   </script>
  </head>
  <body>
  </body>
</html>

Puedes cambiar el contexto al del iframe de la siguiente forma:

cd("#frame1");

Ahora verás que que el global window del documento es el iframe:

Y puedes llamar a las funciones definidas en el iframe:

Helper commands

The JavaScript command line provided by the Web Console offers a few built-in helper functions that make certain tasks easier.

$()
Looks up a CSS selector string, returning the first element that matches. Equivalent to document.querySelector() or calls the $ function in the page, if it exists.
$$()
Looks up a CSS selector string, returning an array of DOM nodes that match. This is like for document.querySelectorAll(), but returns an array instead of a NodeList.
$0
The currently-inspected element in the page.
$_
Stores the result of the last expression executed in the console's command line. For example, if you type "2+2 <enter>", then "$_ <enter>", the console will print 4.
$x()
Evaluates an XPath expression and returns an array of matching nodes.
keys()
Given an object, returns a list of the keys (or property names) on that object. This is a shortcut for Object.keys.
values()
Given an object, returns a list of the values on that object; serves as a companion to keys().
clear()
Clears the console output area.
inspect()
Given an object, opens the object inspector for that object.
pprint()
Formats the specified value in a readable way; this is useful for dumping the contents of objects and arrays.
help()
Displays help text. Actually, in a delightful example of recursion, it will bring you to this page.
cd()

Switch JavaScript evaluation context to a different iframe in the page. This helper accepts multiple different ways of identifying the frame to switch to. You can supply any of the following:

  • a selector string that will be passed to document.querySelector to locate the iframe element
  • the iframe element itself
  • the content window inside the iframe

See working with iframes.

copy()
New in Firefox 38. Copy the argument to the clipboard. If the argument is a string, it's copied as-is. If the argument is a DOM node, its outerHTML is copied. Otherwise, JSON.stringify will be called on the argument, and the result will be copied to the clipboard.
clearHistory()
New in Firefox 39. Just like a normal command line, the console command line remembers the commands you've typed. Use this function to clear the console's command history.

Please refer to the Console API for more information about logging from content.

Etiquetas y colaboradores del documento

 Colaboradores en esta página: axelx5
 Última actualización por: axelx5,