admin管理员组

文章数量:1390498

I am trying to load in a external html file and stringify the contents within the body but can't seem to do so without it producing undesired results. Is there even a way to do this?

var xhr = new XMLHttpRequest();

function loadFile(){
    xhr.open("GET", 'index.html');
    xhr.responseType = "document";
    xhr.send();
}

xhr.onload = function(data) {
    myData = data;
    myString = JSON.stringify(myData.srcElement.responseXML.body.children);
        console.log(myString)
       //logs: {"0":{},"length":1}

    }

loadFile();

But what I need it to load is the actual div contents, ex:

//log: '<div id ='mydiv'>...</div>

What am I doing wrong?

I am trying to load in a external html file and stringify the contents within the body but can't seem to do so without it producing undesired results. Is there even a way to do this?

var xhr = new XMLHttpRequest();

function loadFile(){
    xhr.open("GET", 'index.html');
    xhr.responseType = "document";
    xhr.send();
}

xhr.onload = function(data) {
    myData = data;
    myString = JSON.stringify(myData.srcElement.responseXML.body.children);
        console.log(myString)
       //logs: {"0":{},"length":1}

    }

loadFile();

But what I need it to load is the actual div contents, ex:

//log: '<div id ='mydiv'>...</div>

What am I doing wrong?

Share Improve this question edited Sep 3, 2015 at 13:50 user3612986 asked Sep 3, 2015 at 13:42 user3612986user3612986 3252 gold badges7 silver badges18 bronze badges 4
  • You'll have to extract the content you want into your own JavaScript data structure, and then stringify that. The built-in serializer won't work on the DOM directly. – Pointy Commented Sep 3, 2015 at 13:45
  • use document.body.innerHTML – Raghavendra Commented Sep 3, 2015 at 13:46
  • If what you want is just the actual div contents, then you dont need to JSON.stringify it. Do this instead: myString = myData.srcElement.responseXML.body.children; – kennasoft Commented Sep 3, 2015 at 14:02
  • @raghavendra I need to create the value into a string so that I can replace some values or ids, attributes, text, etc. – user3612986 Commented Sep 3, 2015 at 14:43
Add a ment  | 

2 Answers 2

Reset to default 1

I was able to figure this out by changing the response type to 'DOMString':

function buildAd(file){
    xhr.open("GET", file);
    xhr.responseType = "DOMString";
    xhr.send();
}

Your question is not very clear but I want to give it a try. Inspired from there: https://stackoverflow./a/7539198/1636522. Demo: http://jsfiddle/wared/fezc6tnt/.

function string2dom (html) {
    var iframe, doc;
    iframe = document.createElement('iframe');
    iframe.style.display = 'none';
    document.body.appendChild(iframe);
    doc = iframe.contentDocument || iframe.contentWindow.document;
    iframe.parentNode.removeChild(iframe);
    doc.open();
    doc.write(html);
    doc.close();
    return doc;
}

var dom = string2dom(''
+ '<html>'
+   '<head>'
+     '<title>test</title>'
+   '</head>'
+   '<body>'
+     '<div id="test">allo la <b>terre</b></div>'
+   '</body>'
+ '</html>'
);

document.body.innerHTML = (
    dom.getElementById('test').innerHTML
);

本文标签: Is there a way to JSONstringify an HTML dom object JavaScriptStack Overflow