2009-05-03 8 views
171

क्या JS में एक स्ट्रिंग के रूप में HTML टैग के भीतर संपूर्ण HTML प्राप्त करने का कोई तरीका है?संपूर्ण दस्तावेज़ HTML को स्ट्रिंग के रूप में कैसे प्राप्त करें?

document.documentElement.?? 
+6

केवल सही जवाब: http://stackoverflow.com/questions/ 817218/कैसे-टू-द-द-ऑल-डॉक्यूमेंट-एचटीएमएल-ए-ए-स्ट्रिंग # उत्तर -35 9 172 9 5 (** आंतरिक/बाहरी HTML उत्तरों को वोट-वोट करना, वे पूरे स्रोत को प्रदान नहीं करते हैं! **) – John

उत्तर

233

एमएस outerHTML और innerHTML गुण कुछ समय पहले जोड़ा।

MDN के अनुसार, outerHTML फ़ायरफ़ॉक्स 11, क्रोम 0.2, इंटरनेट एक्सप्लोरर 4.0, ओपेरा 7, सफ़ारी 1.3, एंड्रॉयड, फ़ायरफ़ॉक्स मोबाइल 11, IE मोबाइल, ओपेरा मोबाइल, और सफारी मोबाइल में समर्थित है। outerHTMLDOM Parsing and Serialization विनिर्देशन में है।

आपके लिए क्या काम करेगा इसके लिए ब्राउज़र संगतता के लिए quirksmode देखें। सभी समर्थन innerHTML

var markup = document.documentElement.innerHTML; 
alert(markup); 
+14

बाहरी HTML को डॉक्टरेट नहीं मिलता है। – CMCDragonkai

+0

एक आकर्षण की तरह काम किया! धन्यवाद! दस्तावेज से जुड़ी किसी भी/सभी फाइलों के आकार के साथ-साथ जेएस और सीएसएस फाइलों का आकार पाने का कोई तरीका है? – www139

+0

@CMCDragonkai: आप [अलग से डॉक्टरेट प्राप्त कर सकते हैं] (http://stackoverflow.com/a/10162353/157385) और इसे मार्कअप स्ट्रिंग में प्रीपेड करें। आदर्श नहीं, मुझे पता है, लेकिन संभव है। –

37

मेरा मानना ​​है कि document.documentElement.outerHTML आपके लिए यह वापस कर देना चाहिए।

MDN के अनुसार, outerHTML फ़ायरफ़ॉक्स 11, क्रोम 0.2, इंटरनेट एक्सप्लोरर 4.0, ओपेरा 7, सफ़ारी 1.3, एंड्रॉयड, फ़ायरफ़ॉक्स मोबाइल 11, IE मोबाइल, ओपेरा मोबाइल, और सफारी मोबाइल में समर्थित है। outerHTMLDOM Parsing and Serialization विनिर्देशन में है।

outerHTML property पर एमएसडीएन पृष्ठ नोट करता है कि यह आईई 5+ में समर्थित है। कॉलिन का उत्तर W3C quirksmode पृष्ठ से लिंक है, जो क्रॉस-ब्राउज़र संगतता की अच्छी तुलना प्रदान करता है (अन्य DOM सुविधाओं के लिए भी)।

+0

नहीं सभी ब्राउज़र इसका समर्थन करते हैं। –

+0

@ कोलिन: हाँ, अच्छा बिंदु। अनुभव से, मुझे याद है कि आईई 6+ और फ़ायरफ़ॉक्स दोनों इसका समर्थन करते हैं, हालांकि आपके द्वारा लिंक किए गए क्विर्कमोड पेज अन्यथा सुझाता है ... – Noldorin

+0

फ़ायरफ़ॉक्स बाहरी HTML का समर्थन नहीं करता है। यह आईई मालिकाना है। https://developer.mozilla.org/En/Migrate_apps_from_Internet_Explorer_to_Mozilla#Generate_and_manipulate_content –

5
document.documentElement.outerHTML 
+1

सभी ब्राउज़र इसका समर्थन नहीं करते हैं। –

+2

फ़ायरफ़ॉक्स 11, क्रोम 0.2, इंटरनेट एक्सप्लोरर 4.0, ओपेरा 7, सफारी 1.3, एंड्रॉइड, फ़ायरफ़ॉक्स मोबाइल 11, आईई मोबाइल, ओपेरा मोबाइल, और सफारी मोबाइल ([एमडीएन] (https://developer.mozilla.org/en) में समर्थित -US/docs/डोम/element.outerHTML))। 'बाहरी HTML' [डोम पार्सिंग और सीरियलाइजेशन] में है (http://domparsing.spec.whatwg.org/#outerhtml) विनिर्देश। – XP1

+0

कॉलिन का जवाब अधिक विस्तृत है। –

3
document.documentElement.innerHTML 
+0

यह ' 'टैग वापस नहीं करता है। –

-4

सही तरीका वास्तव में है:

webBrowser1.DocumentText

+2

केवल तभी यदि आप WinForms WebBrowser नियंत्रण में पृष्ठ होस्ट कर रहे हैं ... –

1

मैं हमेशा

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

शायद नहीं सही तरीके से उपयोग, लेकिन मैं इसे समझ जब मैं इसे देख सकते हैं।

+0

यह गलत है क्योंकि यह ' 'टैग वापस नहीं करेगा। –

9

तुम भी कर सकते हैं:

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

आप Doctype या HTML टैग है, लेकिन सब कुछ नहीं मिलेगा ...

4

शायद केवल आईई:

>  webBrowser1.DocumentText 

एफएफ अप के लिए 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)); 

एफएफ में काम कर सकते हैं। (स्रोत-पाठ की बहुत शुरुआत से बहुत पहले 300 वर्ण दिखाता है, अधिकतर डॉक्टरेट-डीफ।)

लेकिन सावधान रहें, सामान्य "सेव करें" - एफएफ माइट का डियालॉग वर्तमान स्थिति को सहेज नहीं सकता पेज, बल्कि मूल रूप से लोड एक्स/एच/टीएमएल-स्रोत-पाठ !! (कुछ temp-file के लिए एसएस का एक पोस्ट-अप और उस पर रीडायरेक्ट करने से पहले किए गए परिवर्तन/संपादन के साथ एक सहेजने योग्य स्रोत-पाठ प्रदान किया जा सकता है।)

हालांकि एफएफ "बैक" पर अच्छी वसूली से आश्चर्यचकित है और "सहेजें (के रूप में) पर राज्यों/मूल्यों का एक एनआईसी शामिल करना ..."इनपुट की तरह मैदान के लिए , पाठ क्षेत्र आदि, contenteditable/designMode में तत्वों पर नहीं ...

नहीं तो एक xhtml- resp। एक्सएमएल फ़ाइल (माइम-प्रकार, नहीं बस फ़ाइलनाम-विस्तार!), कोई दस्तावेज.open/write/close को स्रोत-परत पर अनुमोदन सामग्री को एसईटी करने के लिए उपयोग कर सकता है, जो कि फ़ाइल के उपयोगकर्ता/सेव मेन्यू पर सहेजा जाएगा। एफएफ देखें: http://www.w3.org/MarkUp/2004/xhtml-faq#docwrite resp।

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

एक्स (एचटी) एमएल के प्रश्नों के तटस्थ, "व्यू-स्रोत: http: // ..." कोशिश एक (स्क्रिप्ट निर्मित की src-attrib के मूल्य के रूप में !?) iframe, - एफएफ में एक आईफ्रेम-दस्तावेज़ तक पहुंचने के लिए:

<iframe-elementnode>.contentDocument, Google "mdn contentDocument" को अनुमोदन के लिए देखें। उदाहरण के लिए 'टेक्स्ट सामग्री' जैसे सदस्य। 'उस साल पहले मिला और इसके लिए क्रॉल करना पसंद नहीं है। यदि अभी भी जरूरी जरूरत है, तो इसका उल्लेख करें, मुझे इसमें गोता लगाने के लिए ...

26

मैंने वापस आने के लिए विभिन्न उत्तरों की कोशिश की। मैं क्रोम के नवीनतम संस्करण का उपयोग कर रहा हूँ।

सुझाव document.documentElement.innerHTML; लौटे <head> ... </body>

गैबी के सुझाव document.getElementsByTagName('html')[0].innerHTML; ही लौट आए।

सुझाव document.documentElement.outerHTML;<html><head> ... </body></html> लौटा जो कि 'डॉक्टरेट' से अलग सब कुछ है।

आप document.doctype; साथ doctype वस्तु यह एक वस्तु, न कोई स्ट्रिंग रिटर्न पुनः प्राप्त है, तो कर सकते हैं आप के लिए और HTML5 सहित इसे यहाँ वर्णन किया गया है सभी doctypes के लिए तार के रूप में विवरण को निकालने के लिए की जरूरत है: Get DocType of an HTML as string with Javascript

मैं उपयोग document.documentElement

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

+0

यह सबसे पूरा उत्तर है और इसे स्वीकार किया जाना चाहिए। 2016 तक, ब्राउज़र संगतता पूर्ण हो गई है, और इसे विस्तार से उल्लेख किया जा रहा है (जैसा वर्तमान में स्वीकृत उत्तर में है) अब आवश्यक नहीं है। –

0

: केवल एचटीएमएल 5 चाहता था, इसलिए निम्नलिखित पर्याप्त मुझे पूरे दस्तावेज़ बनाने के लिए किया गया था।

एक ही प्रश्न का उत्तर यहां: https://stackoverflow.com/a/7289396/2164160

+0

उस प्रश्न को बहुत अधिक डुप्लिकेट के रूप में बंद किया जाना चाहिए, जो कि बहुत पुराना है। वैसे भी, दिलचस्प हिस्सा यह है कि आपको '.outerHTML' की आवश्यकता है और 'document.doctype' प्राप्त करने के लिए, और सबसे पूरा उत्तर है [Paolo's] (http://stackoverflow.com/a/26905999/1269037)। –

25

आप ब्राउज़रों में

new XMLSerializer().serializeToString(document) 

कर सकते हैं नए आईई से 9.

+2

दिनांक/समय टिकटों के अनुसार यह * पहला * ** सही उत्तर ** था। एक्सएमएल घोषणा जैसे पेज के हिस्सों को * शामिल नहीं किया जाएगा और अन्य "उत्तरों" का उपयोग करते समय ब्राउज़र कोड को हेरफेर करेंगे। यह * केवल * पोस्ट है जिसे अप-वोट किया जाना चाहिए (डॉस तीन दिन बाद पोस्ट किया गया है)। लोगों को ध्यान देना होगा! – John

+1

यह पूरी तरह से सही नहीं है क्योंकि यह serializeToString एक HTML एन्कोड करता है। उदाहरण के लिए यदि आपके कोड में "टाइम्स न्यू रोमन" जैसे टाइम्स को परिभाषित करने वाली शैलीएं हैं, टाइम्स, सेरिफ़ उद्धरण एचटीएमएल एन्कोडेड प्राप्त करेंगे। शायद आप में से कुछ के लिए यह महत्वपूर्ण नहीं है लेकिन मेरे लिए यह है ... – Marko

+0

@ जॉन अच्छी तरह से ओपी वास्तव में "संपूर्ण HTML _within_ html टैग" के लिए पूछता है। और कॉलिन बर्नेट द्वारा चयनित सबसे अच्छा जवाब यह प्राप्त करता है। यह विशेष उत्तर (एरिक) में एचटीएमएल टैग और डॉक्टरेट शामिल होंगे। उसने कहा, यह मेरे लिए किसी न किसी तरह का हीरा था और वास्तव में मैं क्या देख रहा था! आपकी टिप्पणी ने भी मदद की क्योंकि इसने मुझे इस उत्तर के साथ और अधिक समय बिताया, इसलिए धन्यवाद :) – evanrmurphy

संबंधित मुद्दे