1

Estou capturando a posição de alguns elementos no DOM de um html mas o PhantomJs está ignorando o padding aplicado via css. Após fazer o page.evaluate eu capturo o top/left:

var res = page.evaluate(function () 
{                   
    var imageMapTags="";
    $('a').each(function()
    {    
        var objOffset = $(this).position();
        var top = objOffset.top;
        var left = objOffset.left;
    }
}

Inicialmente imaginei que o html da página podia não estar sendo carregado corretamente, mas ao fazer um console.log(page.content) e pegar a saída, mostra o html carregado corretamente:

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
        <meta charset="UTF-8" /> 
        <title>links</title>   
          <style type="text/css">
              #blog {margin-left: 50px;}
          </style>
    </head> 
    <body> 
        <a id="home" href="http://minhahome.com">Home</a>
        <a id="blog" href="http://blog.com">Blog</a>
        <br/>
    </body> 
</html>

O top/left do link "Home" retorna (8,8) mas do link "Blog" está retornando (49,8) quando na verdade deveria ser (99,8) por causa do CSS que adiciona 50px de padding-left. Este mesmo teste da função .position() do Jquery funciona normal direto no html, mas através do PhantomJs não consigo fazer ele aplicar o style.

1 Resposta 1

0

Tente assim:

var res = page.evaluate(function() {
  var imageMapTags = "";
  $(document).ready(function() {
      $('a').each(function() {
          var objOffset = $(this).position();
          var top = objOffset.top;
          var left = objOffset.left;
        }
      })
  })
})

Talvez o .ready() garanta que o estilo já esteja aplicado.

1
  • Testei aqui com o document.ready mas infelizmente não funcionou, o PhantomJs trava e não consegue sequer imprimir o que esta dentro. Acho que ele não interpreta.
    – rodrigorf
    29/12/2016 às 15:47

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .