将元素附加到调用 createElement() 函数的父级答案

【问题标题】：Appending elements to parents that called the createElement() function将元素附加到调用 createElement() 函数的父级
【发布时间】：2016-04-15 06:39:36
【问题描述】：

我正在尝试创建一个函数，该函数创建一个元素并采用element（一个对象）的参数。

var createElement = function(element) {
  var newElement = document.createElement(element.type);
  var newElement_textNode = document.createTextNode(element.text);
  newElement.appendChild(newElement_textNode);
  element.parent.appendChild(newElement);
};

唯一的问题是我想将元素附加到调用函数的元素。例如：

var list = document.getElementById('ulList');
list.createElement({
    type: 'li',
    text: 'Another item'
});

我的问题是如何将它附加到调用函数的元素，在这种情况下，ul list

【问题讨论】：

为什么你认为How to solve this issue with my program 是一个可以接受的问题标题？提问时在标题中正确描述问题。
好点...这里有编辑按钮吗？
^^^^ 在 cmets 的正上方和左侧

标签： javascript dom

【解决方案1】：

我会创建一个构造函数，您可以向其中添加方法：

function DocNode(id) {
   this.domNode = document.getElementById(id); 
}

DocNode.prototype.createChildElement = function() {
    //add your code logic here
}

var list = new DocNode("testId");

然后可以在任何 DocNode 实例上调用 list.createChildElement()。

【讨论】：

所以如果有像div 这样的另一个元素，我可以像这样在它后面附加一个span：document.querySelector('div').createElement();
是的。上面的代码适用于 dom 中的任何节点。如果你想以不同的方式处理它们，你可以检查节点类型并从那里继续。