Question

是否可以检测网页的Fold而无需在Web浏览器中实际加载？

假设我有5个网址，我希望知道这5个网址的折叠位置而不加载它们。更像是批量操作。可以使用Java/Javascript/Python ?

完成此操作

Answer 1

“折叠”或多或少是一种设计原则，从那时起，当响应不是一件事。如今我不太关心'折叠'，但问问自己这个问题：“为什么要担心折叠？”。

您（或您的设计师）应阅读的精彩文章：http://iampaddy.com/lifebelow600/

说完了......

'fold'是相对于浏览器窗口高度的。在移动设备上，折叠可以小到320px，而在27英寸屏幕上全屏，折叠可以在1400px左右。

如果您的问题是：'如何在不将其加载到浏览器中的情况下检测给定分辨率上特定元素的Y位置？'，您应该重新考虑术语“浏览器”。浏览器是使您的HTML / CSS呈现出一些视觉效果的部分。现在大多数浏览器都会直接呈现在屏幕上（Chrome，Safari，Firefox等）。

然而......还有“无头”浏览器这样的东西。这些浏览器不会呈现给屏幕，但提供与页面交互的功能（如：截取屏幕截图和内容）。在这种情况下，我建议您查看Phantom JS或Casper JS。这些是很棒的软件包，允许你通过脚本加载一个或多个页面并截取它的截图，或者你可以通过简单的JavaScript读出DOM元素的顶部偏移量。

Phantom JS示例：

var page = require('webpage').create();
var url = 'http://phantomjs.org/';
page.open(url, function (status) {
  //Page is loaded!
  // Take screenshot:
  page.render('screenshot.png');
  // Get offsetTop of the footer in the page:
  var offset = page.evaluate(function() {
    return document.querySelector('.footer').offsetTop;
  });
  console.log('Footer offset = ' + offset);
  phantom.exit();
});

希望这对你有所帮助。

检测网页的“折叠”而不在浏览器中加载

1 个答案: