Wie bekomme ich das <html> -Tag HTML mit JavaScript / jQuery?

161

Mit $('html').html()Ich kann die HTML im bekommen <html>Tag ( <head>, <body>usw.). Aber wie kann ich den tatsächlichen HTML-Code des <html>Tags (mit Attributen) abrufen?

Ist es alternativ möglich, den gesamten HTML-Code der Seite (einschließlich Doctype <html>usw.) mit jQuery (oder einfachem altem JavaScript) abzurufen ?

Justin Stayton
quelle

Antworten:

305

Der einfachste Weg, das htmlElement nativ zu erhalten, ist:

document.documentElement

Hier ist die Referenz: https://developer.mozilla.org/en-US/docs/Web/API/Document.documentElement .

UPDATE: Um das htmlElement dann als Zeichenfolge zu erfassen, gehen Sie wie folgt vor:

document.documentElement.outerHTML
Michael
quelle
1
Weitere Informationen zur documentElementBrowserkompatibilität finden Sie auch in dieser Frage : stackoverflow.com/q/11391827/177710 .
Oliver
Wie oft wird auf das HTML-Element verwiesen? Ich denke nicht, dass Leistung im Allgemeinen ein Problem sein sollte. Wie auch immer, dies ist eigentlich die bessere Antwort, aber sie kam WEG nach der Auszeichnung.
Posit Labs
42

So erhalten Sie das HTML-DOM-Element ausschließlich mit JS:

var htmlElement = document.getElementsByTagName("html")[0];

oder

var htmlElement = document.querySelector("html");

Und wenn Sie jQuery verwenden möchten, um Attribute daraus zu erhalten ...

$(htmlElement).attr(INSERT-ATTRIBUTE-NAME);
Posit Labs
quelle
Ihre Antwort wäre erheblich besser, wenn Sie erklären könnten, warum dies die Frage beantwortet. {}Markieren Sie außerdem den Code und klicken Sie auf die Schaltfläche oder drücken Sie Strg + k, um ihn als Code zu markieren.
Ben
18

Neben einigen anderen Antworten können Sie auch auf das HTML-Element zugreifen über:

var htmlEl = document.body.parentNode;

Dann könnten Sie den inneren HTML-Inhalt erhalten:

var inner = htmlEl.innerHTML;

Dies scheint auf diese Weise geringfügig schneller zu sein . Wenn Sie nur das HTML-Element erhalten, document.body.parentNodescheint es jedoch ziemlich viel schneller zu sein .

Nachdem Sie das HTML-Element haben, können Sie mit den Methoden getAttributeund mit den Attributen setAttributeherumspielen.

Für den DOCTYPE können Sie verwenden document.doctype, worauf in dieser Frage näher eingegangen wurde .

Doppelwirbel
quelle
4
Nur als Hinweis: Dies schlägt fehl, wenn der Text im Dokument noch nicht verfügbar ist.
DataDink
3
In diesem Fall document.head.parentNodefunktioniert es immer noch, wenn ein Kopfelement vorhanden ist.
Mahemoff
15

In jQuery:

var html_string = $('html').outerHTML()

In einfachem Javascript:

var html_string = document.documentElement.outerHTML
Berkeleybross
quelle
4

Wenn Sie mit jQuery ein Attribut eines HTML-Elements erhalten möchten, können Sie es verwenden .attr();

So erhalten $('html').attr('someAttribute');Sie den Wert des someAttributeElementshtml

http://api.jquery.com/attr/

Zusätzlich:

Hier gibt es ein jQuery-Plugin: http://plugins.jquery.com/project/getAttributes

Damit können Sie alle Attribute aus einem HTML-Element abrufen

Jordanstephens
quelle
1
Das Projekt getAttributes () ist jetzt etwas alt (Februar 2009).
Gligoran