Question

我有一个这样的课程

var htmlElements=function(){
    var __this=this;
    this.type=''; 
    this.parentDiv='';
    this.id='';
    this.draw=function(){
        if(__this.type=='div'){
            $('<div/>', {
                'id': __this.id,
            })
            .appendTo(__this.parentDiv);
        }
    }
}

从我的消费者类中，我创建了这个类填充属性的对象并调用了draw方法。像这样。在dom中，我有一个div，ID为staticDiv我没有动态创建

var htmlElementsobj=htmlElements();
htmlElements.type='div';
htmlElements.id='firstDiv';
htmlElements.parentDiv='#staticDiv'
htmlElements.draw();

到目前为止它工作正常，但当我尝试在动态创建的div内部绘制另一个元素时

var htmlElementsobj=htmlElements();
    htmlElements.type='div';
    htmlElements.id='nestedDiv';
    htmlElements.parentDiv='#firstDiv'
    htmlElements.draw();

它没有画画。但是，如果我将其父属性更改为staticDiv，则可以正常工作。

Answer 1

当我认为您的意思是引用htmlElements时，您将htmlElementsobj称为对象。此外，您要调用new htmlElements()来创建对象：

＆＃13;

var htmlElements=function(){
  var __this = this;
  this.type = ''; 
  this.parentDiv = '';
  this.id = '';
  this.draw = function(){
    if(__this.type=='div'){
      $('<div/>', {
         'id': __this.id,
      }).text(__this.id).    // for debugging / visualization
         appendTo(__this.parentDiv);
    }
  };
};

var htmlElementsobj = new htmlElements();
    htmlElementsobj.type = 'div';
    htmlElementsobj.id = 'firstDiv';
    htmlElementsobj.parentDiv = '#staticDiv'
    htmlElementsobj.draw();

htmlElementsobj = new htmlElements();
    htmlElementsobj.type = 'div';
    htmlElementsobj.id = 'nestedDiv';
    htmlElementsobj.parentDiv = '#firstDiv'
    htmlElementsobj.draw();

＆＃13;

div {
  border: 1px solid red;
  padding: 5px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="staticDiv"></div>

＆＃13;

使用jquery创建动态嵌套HTML标记

1 个答案: