Os comandos
A linha de comando JavaScript fornecida pelo Console Web oferece algumas funções auxiliares embutidos que tornam certas tarefas mais fáceis.
-
$() -
FX16+ Procura uma seqüência de seletor CSS, retornando o primeiro elemento que corresponda. equivalente a
document.querySelector()ou chama a função de $ na página, se ele existir. -
FX4 to FX16 Procura uma string como um ID de um nó DOM; este é um atalho para
document.getElementById()ou chama a função de $ na página, se ele existir. -
$$() -
Procura uma seqüência de seletor CSS, retornando uma lista de DOM nós que correspondem. Este é um atalho para
document.querySelectorAll(). -
$0 - O elemento atualmente inspecionados na página.
-
$x() - Avaliar uma expressão XPath e retornar um array de nós correspondentes.
-
keys() - Dado um objeto, retorna uma lista de keys (ou nomes de propriedade) no objeto. Este é um atalho para object.keys.
-
values() - Dado um objeto, retorna uma lista de valores nesse objeto, serve como um complemento para keys ().
-
clear() - Limpa a área de saída do console.
-
inspect() - Dado um objeto, abre o inspetor de objeto para aquele objeto.
-
pprint() - Formata o valor especificado de forma legível, o que é útil para despejar o conteúdo de objetos e arrays.
-
help() - Exibe o texto de ajuda. Na verdade, em um exemplo maravilhoso de recursão, ele vai lhe trazer a esta página.
Exemplos
Exemplo: Olhando para o conteúdo de um nó DOM
Digamos que você tem um nó DOM com o ID "título". Na verdade, esta página que você está lendo agora tem um, assim você pode abrir o Web Console e tentar isso agora.
Vamos dar uma olhada no conteúdo desse nó, usando as funções $() e inspect() :
inspect($("#title"))Isso abre automaticamente o inspetor de objeto, mostrando-lhe o conteúdo do nó DOM que coincide com o CSS selector "# title", que é, claro, o elemento com ID "título".
Exemplo: despejar o conteúdo de um nó DOM
Isso é muito bom se acontecer de você estar sentado no navegador exibindo algum problema, mas vamos dizer que você está depurando remotamente para um usuário, e precisa de um olhar para o conteúdo de um nó. Você pode ter seu usuário abrir o Web Console e despejar o conteúdo do nó para o registro, em seguida, copiar e colá-lo em um e-mail para você, utilizando a função pprint ():
pprint($("#title"))
Este expele o conteúdo do nó para que você possa dar uma olhada. Claro, isso pode ser mais útil com outros objetos do que um nó DOM, mas essa é a idéia.