JSON сериализации элемент DOM

Question

Если я:

var el = 
{ 
    o : document.createElement("iframe") 
} 

var fs = JSON.stringify(el); 

and then I try to access with 

var ofs = JSON.parse(fs); 

ofs.o содержит пустой объект не в Iframe элементы ПОЧЕМУ ??

Answer 1

JSON (JavaScript Object Notation) является не предназначен для сериализации DOM узлов, вы должны вытащить материал, который Вы хотите самостоятельно и записать его на объект, а затем повторно создать DOM Nodes от этого, если вам нужно.

В самом деле, Chrome не даже выполнить свой код:

TypeError: Converting circular structure to JSON 

Answer 2

Я сделал это так. Я поставил код на github

function elementToObject(element, o) { 
    var el = $(element); 
    var o = { 
     tagName: el.tagName 
    }; 
    var i = 0; 
    for (i ; i < el.attributes.length; i++) { 
     o[el.attributes[i].name] = el.attributes[i].value; 
    } 

    var children = el.childElements(); 
    if (children.length) { 
     o.children = []; 
     i = 0; 
     for (i ; i < children.length; i++) { 
     child = $(children[i]); 
     o.children[i] = elementToObject(child, o.children) ; 
     } 
    } 
    return o; 
    } 
/* 
    exemple: 
    a = elementToObject(document.body); 
    Object.toJSON(a); 
*/ 

Это Javascript функции преобразования любого элемента объекта, то вы можете преобразовать его в формат JSON.

Answer 3

Опираясь на код prototypejs Алена, я обновил его с помощью подчеркивания и JQuery, а также поместить в сутью here

function elementToObject(element, recurse) { 
    var el = $(element), 
     o = { 
      tagName: el[0].tagName 
     }; 

    _.each(el[0].attributes, function(attribute){ 
     o[attribute.name] = attribute.value; 
    }); 

    if (recurse) { 
     o.children = _.map(el.children(), function(child){ 
      return this.elementToObject(child, true); 
     }, this); 
    } 
    return o; 
} 

Answer 4

function elementToObject(element) { 
    var el = $(element)[0]; 
    var o = {tagName: el.tagName}; 
    _.each(el.attributes, function(attribute){o[attribute.name] = attribute.value;}); 
    o["children"]=_.map($(el).children(), function(child){return elementToObject(child)}); 
    return o; 
} 

Это работает с JQuery 3.1.0 и underscore.js.