Каков предпочтительный метод создания объекта javascript с соответствующими элементами dom?

Question

В настоящее время я делаю это так:

function createPlayer(id) { 
    var playerWrapper = document.createElement("div"); 
    document.body.appendChild(playerWrapper); 

    var player = document.createElement("div"); 
    playerWrapper.appendChild(player); 

    var Player = { 
    wrapper: playerWrapper, 
    player: player 
    } 

} 

Просто интересно, если это лучший способ, или если есть какой-то способ, которым я могу создать элементы DOM и объект одновременно? Объект также будет иметь приложенные методы. Также будет множество экземпляров объекта и связанных с ним элементов.

Answer 1

функция AppendChild возвращает прилагаемый узел, так что вы можете создать пустой объект и присвоить возвращаемые узлы непосредственно к объекту следующим образом: http://jsfiddle.net/v7xeLnot/1/

function createPlayer(id) { 
    var Player = {} 
    var playerWrapper = document.createElement('div'); 
    Player.wrapper = document.body.appendChild(playerWrapper); 

    var player = document.createElement('div'); 
    Player.player = playerWrapper.appendChild(player); 

    return Player; 

} 
var myPlayer = createPlayer("someId"); 

Answer 2

Самого код, который вы должны написать в объектно-ориентированном Способ, как here

Также вы должны использовать jQuery и это append() метод вместо обычного document.createElement и appendChild. Это обеспечит совместимость с несколькими браузерами и упростит использование других функций.

Если вам нужно создать много HTML, вы могли бы рассмотреть некоторые templateing engine