如何将整个文档HTML作为字符串?

Rob*_*cks 213 html javascript document tostring

JS中是否有一种方法可以将整个HTML 作为字符串添加到html标记中?

document.documentElement.??
Run Code Online (Sandbox Code Playgroud)

Col*_*ett 287

MS添加outerHTMLinnerHTML性质,前一段时间.

根据MDN,outerHTMLFirefox 11,Chrome 0.2,Internet Explorer 4.0,Opera 7,Safari 1.3,Android,Firefox Mobile 11,IE Mobile,Opera Mobile和Safari Mobile均支持.outerHTMLDOM解析和序列化规范中.

有关适用于您的内容,请参阅quirksmode以获取浏览器兼容性.所有支持innerHTML.

var markup = document.documentElement.innerHTML;
alert(markup);
Run Code Online (Sandbox Code Playgroud)

  • outerHTML没有获得doctype. (25认同)
  • 像魅力一样工作!谢谢你!有什么方法可以获取链接到文档的任何/所有文件的大小以及包括 js 和 css 文件吗? (2认同)

Eri*_*ner 66

你可以做

new XMLSerializer().serializeToString(document)
Run Code Online (Sandbox Code Playgroud)

在比IE 9更新的浏览器中

请参阅https://caniuse.com/#feat=xml-serializer

  • 根据日期/时间戳,这是*第一个***正确答案**.不会包含页面的部分内容,例如XML声明,浏览器在使用其他"答案"时会操纵代码.这是*唯一*应该被投票的帖子(三天后发布了dos).人们需要注意! (4认同)
  • @John很好OP实际上要求"整个HTML _within_html标签".Colin Burnett选择的最佳答案确实实现了这一目标.这个特殊的答案(Erik的)将包括html标签和doctype.也就是说,这对我来说完全是一颗钻石而且正是我想要的!你的评论也有帮助,因为它让我花更多的时间来回答这个问题,谢谢:) (3认同)
  • 我认为人们应该小心这个,特别是因为它返回的值不是浏览器接收的实际 html。就我而言,它向服务器从未实际发送的 `html` 标签添加了属性:( (3认同)
  • 这不完全正确,因为serializeToString执行HTML编码.例如,如果您的代码包含定义字体的样式,例如"Times New Roman",Times,serif,引号将获得html编码.也许这对你们中的一些人来说并不重要,但对我来说这是...... (2认同)

Nol*_*rin 41

我相信document.documentElement.outerHTML应该为你回报.

根据MDN,outerHTMLFirefox 11,Chrome 0.2,Internet Explorer 4.0,Opera 7,Safari 1.3,Android,Firefox Mobile 11,IE Mobile,Opera Mobile和Safari Mobile均支持.outerHTMLDOM解析和序列化规范中.

outerHTML属性上的MSDN页面指出它在IE 5+中受支持.Colin的答案链接到W3C quirksmode页面,该页面提供了跨浏览器兼容性的良好比较(对于其他DOM功能也是如此).

  • 有没有办法获得包括doctype和html标签在内的所有内容? (4认同)

pau*_*o62 38

我尝试了各种答案,看看返回了什么.我正在使用最新版本的Chrome.

该建议document.documentElement.innerHTML;又回来了<head> ... </body>

盖比的建议document.getElementsByTagName('html')[0].innerHTML;也是如此.

document.documentElement.outerHTML;返回的建议<html><head> ... </body></html> 是"doctype"之外的所有内容.

您可以使用document.doctype; This返回一个对象而不是字符串来检索doctype对象.因此,如果您需要将详细信息作为字符串提取到包括HTML5在内的所有文档类型,请在此处进行描述:使用Javascript将HTML的DocType作为字符串获取

我只想要HTML5,所以以下内容足以让我创建整个文档:

alert('<!DOCTYPE HTML>' + '\n' + document.documentElement.outerHTML);

  • 这是最完整的答案,应该被接受.截至2016年,浏览器兼容性已完成,不再需要详细提及(如当前接受的答案). (5认同)

Hak*_*kan 9

你也可以这样做:

document.getElementsByTagName('html')[0].innerHTML
Run Code Online (Sandbox Code Playgroud)

你不会得到Doctype或html标签,但其他一切......


小智 6

可能只有 IE:

>     webBrowser1.DocumentText
Run Code Online (Sandbox Code Playgroud)

对于 FF 从 1.0 起:

//serialize current DOM-Tree incl. changes/edits to ss-variable
var ns = new XMLSerializer();
var ss= ns.serializeToString(document);
alert(ss.substr(0,300));
Run Code Online (Sandbox Code Playgroud)

可以在FF工作。(显示源文本开头的前 300 个字符,主要是 doctype-def。)

但请注意,FF 的正常“另存为”对话框可能不会保存页面的当前状态,而是保存最初加载的 X/h/tml-source-text !(将 ss 后置到某个临时文件并重定向到该临时文件可能会提供可保存的源文本,其中包含之前对其进行的更改/编辑。)

尽管 FF 令人惊讶的是“返回”的良好恢复以及在“另存为...”上很好地包含状态/值,用于输入字段、文本区域等,而不是在 contenteditable/designMode 中的元素上...

如果不是 xhtml- 则。xml 文件(mime 类型,不仅仅是文件扩展名!),可以使用 document.open/write/close 来设置 appr。内容到源层,该内容将通过 FF 的文件/保存菜单保存在用户的保存对话框中。请参阅: http: //www.w3.org/MarkUp/2004/xhtml-faq#docwrite分别。

https://developer.mozilla.org/en-US/docs/Web/API/document.write

对 X(ht)ML 的问题保持中立,尝试使用“view-source:http://...”作为(脚本制作的!?)iframe 的 src-attrib 的值,- 访问 iframe- FF 中的文档:

<iframe-elementnode>.contentDocument,请参阅 google“mdn contentDocument”了解 appr。成员,例如“textContent”。“几年前就知道了,但我不想爬着去拿。” 如果仍然有紧急需要,请提及这一点,我必须深入研究......


Bri*_*ell 5

document.documentElement.outerHTML
Run Code Online (Sandbox Code Playgroud)

  • 在Firefox 11,Chrome 0.2,Internet Explorer 4.0,Opera 7,Safari 1.3,Android,Firefox Mobile 11,IE Mobile,Opera Mobile和Safari Mobile([MDN](https://developer.mozilla.org/en-)中受支持美国/文档/ DOM/element.outerHTML)).`outerHTML`在[DOM解析和序列化](http://domparsing.spec.whatwg.org/#outerhtml)规范中. (2认同)