4 Formas Fáceis de Inspecionar Elementos em um iPhone

PDF download Baixe em PDF
Coescrito por Luigi Oppido

PDF download Baixe em PDF

Você precisa fazer o debug de um site no iPhone, mas não está encontrando a opção "Inspecionar Elemento"? Embora o recurso não seja nativo no Safari do iPhone, ainda existem formas de inspecionar elementos de páginas da web sem gastar com aplicativos pagos. O jeito oficial é usar as Ferramentas de Desenvolvedor do Safari, mas para isso você vai precisar de um Mac. Caso não haja nenhum computador por perto, dá para instalar um app chamado Web Inspector ou criar um favorito no JavaScript (que também funciona no Chrome). Por fim, caso seu objetivo seja apenas mudar a aparência de uma página, basta usar um atalho chamado Editar Página da Web.

O que você precisa saber

  • Use as Ferramentas do Desenvolvedor do Safari para inspecionar elementos conectando o iPhone ao Mac.
  • Para inspecionar um elemento sem um computador, instale o aplicativo Web Inspector ou use um favorito do JavaScript.
  • Para editar textos ou remover imagens de um site, use o Editar Página da Web no aplicativo Atalhos.
Método 1
Método 1 de 4:

Usando as Ferramentas do Desenvolvedor no Safari

PDF download Baixe em PDF
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/2\/2d\/13805741-1.jpg\/v4-460px-13805741-1.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/2d\/13805741-1.jpg\/v4-728px-13805741-1.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Caso você queira usar o recurso Inspecionar Elemento no Safari pelo iPhone sem precisar de ferramentas externas, é só acessar as Ferramentas do Desenvolvedor do Safari. O único porém é que elas só estão disponíveis no macOS — ou seja, este método envolve um computador.
    • Você tem que conectar o iPhone ao Mac usando um cabo USB , já que não é possível inspecionar elementos a partir da conexão por Wi-Fi.
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/c4\/13805741-2.jpg\/v4-460px-13805741-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/c4\/13805741-2.jpg\/v4-728px-13805741-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Faça o seguinte:
    • Acesse os Ajustes do iPhone.
    • Role a tela para baixo e toque em Safari .
    • Role a tela para baixo e toque em Avançado .
    • Toque na barrinha ao lado de "Inspetor Web" para ativá-lo (ou seja, deixá-lo verde).
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/4\/4e\/Inspect-Element-on-iPhone-Step-3.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/4\/4e\/Inspect-Element-on-iPhone-Step-3.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Você pode pular este passo se já estiver vendo o menu Desenvolvedor quando abre o Safari. Se não o vê, faça o seguinte:
    • Acesse o menu Safari .
    • Clique em Ajustes .
    • Clique em Avançado .
    • Selecione "Mostrar menu Desenvolvedor na barra de menus". [1]
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/cb\/13805741-4.jpg\/v4-460px-13805741-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/cb\/13805741-4.jpg\/v4-728px-13805741-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Use o Safari no iPhone para acessar o site em que você quer usar o recurso Inspecionar Elemento.
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/ce\/Inspect-Element-on-iPhone-Step-5.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/ce\/Inspect-Element-on-iPhone-Step-5.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    O iPhone vai aparecer nele.
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/2\/24\/Inspect-Element-on-iPhone-Step-6.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/24\/Inspect-Element-on-iPhone-Step-6.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Isto abre o painel Inspecionar Elemento no Mac para o site que você acessou no iPhone.
    • À medida que você seleciona itens na guia Elementos do Mac, esses elementos vão ficar realçados no iPhone. [2]
    • Se você quiser continuar usando o recurso Inspecionar Elemento sem deixar o iPhone conectado ao Mac, acesse o menu Desenvolvedor novamente e selecione Conectar via Rede .
    Publicidade
Método 2
Método 2 de 4:

Usando a extensão Web Inspector

PDF download Baixe em PDF
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/cb\/13805741-7.jpg\/v4-460px-13805741-7.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/cb\/13805741-7.jpg\/v4-728px-13805741-7.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Essa extensão gratuita para o Safari no iPhone e iPad permite que o usuário inspecione elementos sem um computador. Faça uma busca por "web inspector" e "and a dinosaur" na App Store ou baixe a extensão diretamente neste link .
    • O Web Inspector é muito útil para inspecionar elementos no Safari, já que você não precisa conectar o iPhone a um Mac. Caso queira fazer o debug no Chrome, pule para o próximo método.
    • Embora a extensão seja confiável, ela não é uma ferramenta oficial da Apple.
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/76\/13805741-8.jpg\/v4-460px-13805741-8.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/76\/13805741-8.jpg\/v4-728px-13805741-8.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Faça o seguinte:
    • Abra o Safari e acesse qualquer site.
    • Toque em Aa na barra de endereço.
    • Toque em Gerenciar Extensões . [3]
    • Toque na barrinha ao lado de "Web Inspector" para ativar a extensão.
    • Toque em OK .
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/9\/9a\/Inspect-Element-on-iPhone-Step-9.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-9.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/9\/9a\/Inspect-Element-on-iPhone-Step-9.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-9.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Agora que você habilitou o Web Inspector, já pode inspecionar qualquer elemento diretamente pelo Safari.
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/aa\/13805741-10.jpg\/v4-460px-13805741-10.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/aa\/13805741-10.jpg\/v4-728px-13805741-10.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Para isso, toque em Aa novamente e selecione Web Inspector .
    • Para permitir que o Web Inspector inspecione elementos no site por um único dia, selecione Permitir por Um Dia .
    • Caso você queira usar o Web Inspector por mais tempo ou em vários sites, selecione Sempre Permitir... . Em seguida, toque em Sempre Permitir Neste Site ou Sempre Permitir em Todos os Sites .
      • Se você tocar nesta última opção, não vai precisar dar permissão ao Web Inspector para acessar sites nenhuma outra vez.
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/ae\/Inspect-Element-on-iPhone-Step-11.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-11.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/ae\/Inspect-Element-on-iPhone-Step-11.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-11.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Você vai expandir a ferramenta Inspecionar Elemento comum no rodapé do Safari.
    • Quando você terminar, toque duas vezes em Aa para fechar o Web Inspector.
    Publicidade
Método 3
Método 3 de 4:

Usando um favorito do JavaScript

PDF download Baixe em PDF
{"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/f\/f5\/Inspect-Element-on-iPhone-Step-12.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-12.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/f\/f5\/Inspect-Element-on-iPhone-Step-12.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-12.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
  1. 1
    Acesse o site que você quer inspecionar. Neste método, você vai criar um favorito que contenha uma linha de código do JavaScript para permitir o recurso Inspecionar Elemento em qualquer navegador do iPhone. O truque funciona no Safari e no Chrome, embora os passos exatos para criar o favorito variem um pouco.
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/35\/Inspect-Element-on-iPhone-Step-13.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-13.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/35\/Inspect-Element-on-iPhone-Step-13.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-13.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    • No Chrome: toque no menu dos três pontos e selecione Adicionar aos Favoritos .
    • No Safari: toque no ícone de compartilhamento e em Adicionar Favorito .
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/c7\/Inspect-Element-on-iPhone-Step-14.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-14.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/c7\/Inspect-Element-on-iPhone-Step-14.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-14.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Agora que você criou o favorito, é hora de editá-lo.
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/bc\/Inspect-Element-on-iPhone-Step-15.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-15.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/bc\/Inspect-Element-on-iPhone-Step-15.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-15.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    • No Chrome: toque no menu dos três pontos e selecione Favoritos no topo. Em seguida, toque no novo favorito por alguns segundos e selecione Editar Favorito .
    • No Safari: toque no ícone do livro aberto e selecione Favoritos . Em seguida, toque no favorito por alguns segundos e em Editar .
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/7a\/Inspect-Element-on-iPhone-Step-16.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-16.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/7a\/Inspect-Element-on-iPhone-Step-16.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-16.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Renomeie o favorito como "Inspecionar", cole o seguinte código no campo URL ou Link (sem alterar nada) e salve tudo. 
     javascript 
 : 
 ( 
 function 
 () 
 { 
 var 
 script 
 = 
 document 
 . 
 createElement 
 ( 
 'script' 
 ); 
 script 
 . 
 src 
 = 
 "//cdn.jsdelivr.net/npm/eruda" 
 ; 
 document 
 . 
 body 
 . 
 appendChild 
 ( 
 script 
 ); 
 script 
 . 
 onload 
 = 
 function 
 () 
 { 
 eruda 
 . 
 init 
 () 
 } 
 })();
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/f\/fd\/Inspect-Element-on-iPhone-Step-17.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-17.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/f\/fd\/Inspect-Element-on-iPhone-Step-17.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-17.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Para abrir o favorito no Chrome, toque nos três pontos e selecione Favoritos e Inspecionar . No Safari, o favorito Inspecionar fica na lista com outros sites especificados. Dentro de alguns segundos, você vai ver o ícone de uma engrenagem na página que deseja inspecionar.
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/1\/15\/Inspect-Element-on-iPhone-Step-18.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-18.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/1\/15\/Inspect-Element-on-iPhone-Step-18.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-18.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    A partir de agora, você pode usar a guia Elementos (no topo do painel) para inspecionar certos pontos da página que está aberta.
    Publicidade
Método 4
Método 4 de 4:

Usando o atalho Editar Página da Web

PDF download Baixe em PDF
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/1\/18\/Inspect-Element-on-iPhone-Step-19.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-19.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/1\/18\/Inspect-Element-on-iPhone-Step-19.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-19.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Se seu objetivo é editar a aparência de um site usando o recurso Inspecionar Elemento, dá para conseguir o mesmo efeito usando o atalho do iPhone chamado Editar Página da Web. Embora ele não leve à tela tradicional do recurso, ainda é possível fazer alterações em qualquer página.
    • O aplicativo Atalhos fica na Biblioteca de Apps.
    • Este método é útil se você quiser editar textos ou remover imagens e outros objetos de um site que está visualizando.
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/5\/56\/Inspect-Element-on-iPhone-Step-20.jpg\/v4-460px-Inspect-Element-on-iPhone-Step-20.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/5\/56\/Inspect-Element-on-iPhone-Step-20.jpg\/v4-728px-Inspect-Element-on-iPhone-Step-20.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    A opção fica no canto inferior direito da página.
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/af\/13805741-21.jpg\/v4-460px-13805741-21.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/af\/13805741-21.jpg\/v4-728px-13805741-21.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Digite editar página da web na barra de pesquisa e toque no atalho quando ele aparecer na lista.
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/b4\/13805741-22.jpg\/v4-460px-13805741-22.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/b4\/13805741-22.jpg\/v4-728px-13805741-22.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    A opção é azul e fica no rodapé da página.
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/7d\/13805741-23.jpg\/v4-460px-13805741-23.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/7d\/13805741-23.jpg\/v4-728px-13805741-23.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Você precisa fazer uma alteração rápida nos ajustes do Atalhos para que o Editar Página da Web funcione:
    • Acesse os Ajustes do iPhone.
    • Role a tela para baixo e toque em Atalhos .
    • Toque em Avançado .
    • Ative a opção "Permitir a Execução de Scripts".
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/c1\/13805741-24.jpg\/v4-460px-13805741-24.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/c1\/13805741-24.jpg\/v4-728px-13805741-24.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Qualquer site serve aqui.
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/4\/42\/13805741-25.jpg\/v4-460px-13805741-25.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/4\/42\/13805741-25.jpg\/v4-728px-13805741-25.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    O ícone de compartilhamento é um quadrado azul com uma seta para baixo e fica no rodapé da tela.
  8. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/34\/13805741-26.jpg\/v4-460px-13805741-26.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/34\/13805741-26.jpg\/v4-728px-13805741-26.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Isto vai dar permissão ao atalho para "editar" o site na janela do navegador.
  9. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/0\/01\/13805741-27.jpg\/v4-460px-13805741-27.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/01\/13805741-27.jpg\/v4-728px-13805741-27.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Você vai voltar ao site. A partir de agora, já é possível editar o visual dele.
    • Toque em qualquer elemento que você queira editar. A partir de agora, você pode editar textos e imagens do site sem precisar do recurso Inspecionar Elemento no Safari.
    Publicidade

Dicas

  • Existem opções de apps pagos que permitem a inspeção de elementos no iPhone, incluindo o Achoo HTML Viewer & Inspector e o Inspect Browser.
  • O Adobe Edge Inspect era uma ferramenta popular para inspecionar elementos de sites, mas ele já não está em desenvolvimento e nem recebe atualizações. [4]
Publicidade

WikiHows Relacionados

"Nenhuma Localização Encontrada" no Buscar do iPhone: Significado e Soluções
"Líquido Detectado no Conector Lightning": 5 Formas de Consertar
Como
Ajustar o Volume do Alarme em um iPhone
2 Formas de Extrair Imagens de Vídeos no iPhone ou iPad
3 Formas de Organizar Aplicativos no iPhone em Ordem Alfabética
Seu iPhone Foi Hackeado? Como Descobrir e o Que Fazer
Como
Desativar o VoiceOver no iPhone
Deletando Assinaturas Vencidas no iPhone: É Possível?
Como Ver e Entender Ligações Canceladas no iPhone
Como
Verificar se um iPhone é Roubado
Não Consegue Encerrar uma Sessão do ID Apple? Veja Como Resolver Isso
Por Que Meu iPhone Vai Direto para a Caixa Postal?
O Que Causa as Linhas Verdes na Tela do iPhone? Como Consertar?
Como
Conectar um iPhone ao Som do Carro
Publicidade

Referências

  1. ↑ https://support.apple.com/pt-br/guide/safari/sfri20948/mac
  2. ↑ https://support.apple.com/pt-br/guide/safari-developer/dev1a8227029/mac
  3. ↑ https://support.apple.com/pt-br/guide/iphone/iphab0432bf6/ios
  4. ↑ https://helpx.adobe.com/edge-inspect/system-requirements.html

Sobre este guia wikiHow

Em outras línguas
Esta página foi acessada 8 714 vezes.

Este artigo foi útil?

Publicidade