리스너를 추가 할 수 없습니까?

Question

여기 또 다른 문제가 있습니다. 문제는 수동으로 추가하는 URL에 이벤트 리스너를 추가 할 수 없다는 것입니다. 제가 누락 된 것이 있습니까? 나는 이것이 DOM에 요소를 추가하는 적절한 방법이라고 생각했다.

popup.js

window.addEventListener('DOMContentLoaded', function() { 
    var urls= document.querySelectorAll('a.url'); 
    for(i=0,len=urls.length;i<len; i++) { 
    urls[i].addEventListener('click', function() { 
     chrome.tabs.create({url: this.href}); 
    }, false); 
    } 
}, false); 

chrome.storage.local.get(['bookmarks'], function(data) { 
    var jsonString = JSON.stringify(data); 
    var resultObject = JSON.parse(jsonString); 
    //var body = document.body; 
    for(var i in resultObject.bookmarks) { 
    var bookmark = resultObject.bookmarks[i]; 
    var div = document.createElement('div'); 
    var a = document.createElement('a'); 
    var body = document.body; 
    body.appendChild(div); 
    div.appendChild(a); 
    a.setAttribute('class', 'url'); 
    a.setAttribute('href', bookmark.url); 
    a.innerHTML = bookmark.title; 
    } 
}); 

나는 또한 내가의 URL을하는 데 사용되는 HTML 파일을 가지고,하지만 사용자가 수동으로 URL을 추가 할 수 있도록 자바 스크립트 파일에 찬성들을 제거했다.

감사합니다,

Answer 1

당신은 당신이 수동으로 추가 할 수 있지만 당신이 DOM 요소를 생성 한 후 이벤트 리스너를 추가해야 하나 또는 당신이 처리 위임 이벤트를 사용으로 전환해야 할 요소를 DOM 이벤트 리스너를 추가 할 수 있습니다 부모 개체를 만들거나 모든 동적 링크가 이미 만들어 질 때까지 현재 루프에서 이벤트 수신기를 추가 할시기를 변경하십시오.

이 경우 새 링크를 만들 때 바로 이벤트 처리기를 추가하는 것이 좋습니다.

function linkClick() { 
    chrome.tabs.create({url: this.href}); 
} 

window.addEventListener('DOMContentLoaded', function() { 
    var urls= document.querySelectorAll('a.url'); 
    for(i=0,len=urls.length;i<len; i++) { 
    urls[i].addEventListener('click', linkClick, false); // <== change this 
    } 
}, false); 

chrome.storage.local.get(['bookmarks'], function(data) { 
    var jsonString = JSON.stringify(data); 
    var resultObject = JSON.parse(jsonString); 
    //var body = document.body; 
    for(var i in resultObject.bookmarks) { 
    var bookmark = resultObject.bookmarks[i]; 
    var div = document.createElement('div'); 
    var a = document.createElement('a'); 
    var body = document.body; 
    body.appendChild(div); 
    div.appendChild(a); 
    a.setAttribute('class', 'url'); 
    a.setAttribute('href', bookmark.url); 
    a.innerHTML = bookmark.title; 
    a.addEventListener('click', linkClick, false); // <== add this 
    } 
});