Dica: selecionar elementos nas ferramentas de desenvolvedor do Chrome e no Firebug

Primeira dica: Selecionando um elemento inspecionado usando javascript no console

$0;
console
.log($0.id);

Na verdade, o Google Chrome pode se lembrar dos últimos cinco elementos inspecionados (o firebug se lembra dos dois últimos):

$0; // most recent
$1
;
$2
;
$3
;
$4
;
$5
;

Segunda dica: Selecionando elementos usando xpath do console:

Funciona bem com documentos html e xml

Enquanto no console das ferramentas de desenvolvedor do Chrome ou Firebug, podemos escrever:

$x('xpath expression'); // returns an array of results

Exemplos:

selecione o elemento do corpo:

$x('//body'); //equivalent to "body" selector in css

selecionando todas as imagens que são filhos diretos de um div

$x('//div/img'); //equivalent to "div > img" selector in css

selecionar todos os elementos com classe é igual a algo

$x('//*[@class="something"]');

Bem, você entendeu …

Além de ser uma ferramenta muito útil para depurar elementos, é uma maneira muito confortável de aprender e praticar o xpath