다시로드/내 문제를 설명하기 위해 jQuery를 요소

Question

를 다시 찾기, 여기에 내가 작은 데모 스크립트가 있습니다 =

/user.html =

<div id="user-box"></div> 

JS를

class UserComponent { 
    constructor({}) { 
    this.srcFile = "/user.html"; 
    this.parentBox = $("#container-box"); 

    this.childBox = $("#user-box"); 
    }; 

    show(){ 
     this.parentBox.load(this.srcFile, function() { 
      this.childBox.html("<p>Hello</p>") 
     }.bind(this)); 
    }; 
} 

문제는이 회선이 올바르게 작동하지 않는다는 것입니다.

this.childBox.html("<p>Hello</p>") 

제게있어서 this.chilBox이 생성자에서 참조되면 DOM에 아직 존재하지 않는 것 같습니다.

 this.parentBox.load(this.srcFile, function() { 
      var childBox = $("#user-box"); 
      childBox.html("<p>Hello</p>") 
     }.bind(this)); 

그런 다음 작동 :

내 코드를 다시 쓸

. 하지만 생성자에서 요소를 참조하고 싶습니다.

생성자에서 요소를 참조한 다음 나중에 어떻게 사용할 수 있습니까?

나는 this.childBox.find().html("<p>Hello</p>")을 시도했으나 작동하지 않았습니다.

도움 주셔서 감사합니다.

Answer 1

새로운 UserComponent을 만들 때 DOM이 완료되도록이

this.childBox.html($("<p>Hello</p>"))

대신

this.childBox.html("<p>Hello</p>")