Como verificar uma expressão XPath na ferramenta de desenvolvimento do Chrome ou firefox?

Como posso verificar o meu XPath?

estou a usar a ferramenta de desenvolvimento do Chrome para inspeccionar os elementos e formar o meu XPath. Eu verifico isso usando o plugin Chrome XPath Checker, no entanto, nem sempre me dá o resultado. Qual é a melhor maneira de verificar o meu XPath?

eu também tentei usar Firebug para inspecionar o bug e também usar o fogo para verificar. Mas o fogo também verifica o XPath.

A minha última opção seria usar o WebDriver de selénio para confirme o meu XPath.

Author: Jens Erat, 2014-03-21
Source

5 answers

Cromado

Isso pode ser alcançado através de três abordagens diferentes (veja o artigo do meu blog Aqui para mais detalhes):

  • procura em Elements painel como em baixo
  • executar $x() e $$() em Console painel, como mostrado na resposta de Lawrence
  • as extensões de terceiros (não são realmente necessárias na maioria dos casos, podem ser um exagero)

Aqui está como procura o XPath no painel {[[0]}:

  1. Pressione F12 para abrir a Ferramenta de desenvolvimento Chrome
  2. no painel "Elementos", carregue em Ctrl+F
  3. na caixa de pesquisa, escreva no Selector XPath ou CSS, se forem encontrados elementos, estes serão realçados em amarelo.

enter image description here

Firefox (desde a versão 75)

Dado que 75 FF é possível usar a consulta XPath raw sem as expressões XPath de avaliação, veja documentação para mais informações.

Firefox (versão anterior 75)

  1. tanto pode seleccionar a "consola Web" do submenu de Desenvolvimento Web no O menu Firefox (ou o menu Ferramentas se mostrar a barra de menu ou estiver no Mac OS X)
    ou pressione a Ctrl+Mudança+K (Comando+Opção+K no OS X) atalho de teclado.

  2. Na linha de comandos em baixo use o seguinte:

    • $(): Devolve o primeiro elemento correspondente. Equivalente a document.querySelector() ou chama a $ função na página, se existir.

    • $$(): devolve uma série de nós DOM que correspondem. Isto é como para document.querySelectorAll(), mas devolve um array em vez de um NodeList.

    • $x(): avalia uma expressão de XPath e devolve um conjunto de nós correspondentes.

Firefox (versão anterior 49)

  1. Instalar Firebug
  2. Instalar Fogo
  3. Pressione F12 para abrir Firebug
  4. mudar para FirePath painel
  5. na lista, seleccione o XPathor CSS
  6. escreva para localizar

enter image description here

 384
Author: Yi Zeng, 2020-04-10 16:43:19

Você pode abrir o DevTools no Chrome com CTRL+I no Windows (ou CMD+I Mac), e o Firefox com F12, em seguida, selecione o Console separador), e verificar o XPath escrevendo $x("your_xpath_here").
Isto irá devolver um conjunto de valores correspondentes. Se estiver vazio, você sabe que não há correspondência na página.

Firefox v66 (abril de 2019):

Firefox v66 console xpath

Cromado v69 (abril de 2019):

Chrome v69 console xpath

 55
Author: bosnjak, 2019-10-25 01:11:09

Usando o cromo ou a Ópera

Sem quaisquer plugins, sem escrever um único carácter de sintaxe XPath

  1. carregue com o botão direito no elemento necessário e depois"inspeccione"
  2. carregue com o botão direito na marca do elemento seleccionado, escolha copiar → copiar o XPath .

;)

Enter image description here

 19
Author: Eng. Samer T, 2020-11-06 05:00:23

Outra opção para verificar o seu xpath é usar selénio IDE.

  1. Instalar Firefox Selenium IDE
  2. Abra a sua aplicação no FireFox e abra a IDE
  3. em IDE, numa nova linha, cole o seu xpath ao alvo e carregue Encontrar. O elemento correspondente seria realçado no seu application

Selenium IDE

 1
Author: AJC, 2016-06-20 20:15:16

Eu verifico os selectores de XPath e CSS usando a extensão WebSync Chrome .

Oferece a possibilidade de verificar os selectores e também de gerar/modificar os selectores Carregando nos atributos dos elementos.

https://chrome.google.com/webstore/detail/natu-websync/aohpgnblncapofbobbilnlfliihianac

enter image description here

 0
Author: wsbaser, 2020-11-06 05:03:40