自动将类分配给新元素(使用父级)

时间:2018-08-02 12:39:20

标签: javascript dom

我正在创建一个非常基本的框架,用于使用javascript向DOM中添加元素,因此一开始我要这样做:

function newElement(tag, id, className, innerHtml) {}

一切都很好,直到className属性变得过于重复和混乱,我还需要在某些位置使用某些类。因此,我基本上想将CSS类自动分配给我的元素。我想到有Map对象,其键为class / id,值作为字符串/数组,所以我最终像这样:

function newElement(parent, tag, id, innerHtml) {
  var e = document.createElement(tag);
  var testedAttributes = [parent.id, parent.className, id];
  for (var key of testedAttributes) {
    if app.classMap.has(key) {
      //check if app.classMap.get(key) is array
      //assign className by index
      //else assign by value
    }
  ..
  return e;
}

这样可以吗,还是我应该采用一种更好的方式来添加元素? 例如,评估添加(事件)的类?

1 个答案:

答案 0 :(得分:1)

请勿将用于创建元素的实用程序功能与在某些事物上放置类的应用程序逻辑混合使用。相反,我建议为每个父元素编写一个add函数,然后将期望的类放在通常创建的元素上,然后再将它们附加到特定位置的DOM中。

function newElement(tag, attributes, children) { … }

function addItem(element) {
     element.classList.add("item");
     app.itemParent.appendChild(element);
}