javascript - 使用 Javascript 从浏览器的查看源代码功能中获取 HTML

Question

是否可以通过使用浏览器的功能view-source以某种方式将 HTML 代码转换为 Javascript 字符串：

view-source:http://www.google.com

我正在尝试使用这样的代码，但我收到有关未定义文档的错误：

document.getElementsByTagName('html')[0].innerHTML;

我知道跨域请求是不可能的，除非使用某种 hack，但这看起来更容易，尽管获取代码非常困难。我不想访问网站以阻止图像和 CSS 加载。

Answer 1

除非它与您合作，否则您无法从其他域读取数据。

如果您确实有这种合作，您可以简单地发送一个 CORS AJAX 请求。

Answer 2

适用于 Chrome 和 Firefox。Safari 假设。IE 未经测试。

document.querySelector('html').innerHTML

*编辑我认为您的错误来自其他地方。这种说法虽然笨拙，但完全有效。

如果您收到有关文档未定义的错误，那么您是在文档对象准备好之前执行此操作（您是在等待 DOMREADY 还是加载？）或在 DOM 接口（网络工作者？）之外执行。

Answer 3

这是在 Firefox 中执行此操作的一种方法。它在其他任何地方都不起作用afaik。为简单起见，我使用了 alert() 并同步“ajax”，但是对于任何 ajax lib，异步版本都是微不足道的。

主要的事情是让 firefox 的漂亮的 view-source html 返回，它指示行号、HTML 错误和标记 html 部分（如属性和内容）到语义包装器中。这是我知道在没有互联网连接的情况下在浏览器中验证 html 的唯一方法...

// sync url fetcher function:
function IO(a){var b=new XMLHttpRequest;b.open("GET",a,!1);b.send();return b.responseText}

// create a new iframe to show the source code:
var fr=document.createElement("iframe");

// when it loads, let's view it using a simple alert()
fr.onload=function(){
  alert(win.document.documentElement.outerHTML);
  document.body.removeChild(fr);
};

// now add the frame into the document:
document.body.appendChild(fr);

// now assign the view-source url to the frame to trigger it's onload()
url= "/"; //just use site's home page for this demo
fr.src="view-source:data:text/html,"+escape( IO( url ) );

哦，当然，这仅适用于您域上的 URL 或使用 cors 设置的 URL。