如何使用 phantomJS 模拟鼠标悬停在 HTML 元素上

Posted 2023-02-21

【中文标题】如何使用 phantomJS 模拟鼠标悬停在 HTML 元素上

【英文标题】：How to use phantomJS to simulate mouse hover on a HTML element

【发布时间】：2013-05-30 17:03:01

【问题描述】：

我有下面的 phantomJS 代码来获取 html 代码：

var page = require('webpage').create();
var url = 'http://example.com/';

page.open(url, function (status) 
    var js = page.evaluate(function () 
        return document;
    );
    console.log(js.all[0].outerHTML); 
    phantom.exit();
);

我要获取的内容只有在鼠标悬停在由 javascript 控制的特定元素上时才会被读取，因此上面的代码不起作用。

我想知道如何使用 phantomJS 代码模拟鼠标悬停在 HTML 元素上。假设我想将鼠标悬停在一个元素上然后将 HTML 转储到输出，我应该怎么做？

编辑：以下代码不起作用。可能是什么问题？

var page = require('webpage').create();
var url = 'http://example.com/';

page.open(url, function (status) 
    page.includeJs("http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js", function()
        $('#some_element').trigger('hover');
    );
    var js = page.evaluate(function () 
        return document;
    );
    console.log(js.all[0].outerHTML); 
    phantom.exit();
); 

【参考方案1】：

尝试使用 jquery load 您的页面：

page.includeJs("http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js", function() 
    //(...)
);

然后在你的元素上调用悬停：

$('#some_element').trigger('hover');

【讨论】：

在我意识到代码正在等待mouseenter 之后，这对我有用。