여러 페이지에 요소 숨기기

Question

클릭시 페이지에 jQuery 요소를 숨기는 크롬 확장을 생성합니다.

이 요소에 대한 참조를 chrome.storage API에 저장해야하므로 나중에 페이지를로드 할 때 해당 요소를 다시 숨길 수 있습니다.

페이지로드시 DOM 트리가 다시 작성된다는 것을 알고 있으며 이것이 어떤 영향을 주는지 확신 할 수 없습니다. 요소는 페이지의 모든 요소 일 수 있으므로 클래스/ID 이름이 반드시 필요한 것은 아닙니다.

참조를 저장하는 가장 좋은 방법은 무엇입니까? 나는이 일을하는 방법에 대한 아이디어가 전혀 없다.

Xan에 의해 제안으로 업데이트

, 지금 요소에 대한 참조를 저장하는 XPath를 사용하고 있습니다.

는 // 요소가

var elem = e.target || e.srcElement; 
$(elem).click(function() { 
      xPathOfElem = getElementXPath(elem); //Get xPath of element 
      updateStorage(xPathOfElem); 
      $(elem).hide(""); 
      return false; 
     }); 

// 스토어는

function updateStorage(xPathOfElem) { 
    chrome.storage.sync.set({"element":xPathOfElem} //set xPath to storage 
     , function (data) {}); 
}; 

//로드에 검색 받기 나중에

function getStorage() { 
    chrome.storage.sync.get(null, function (data) { 
     $(getElementsByXPath(document, data.element)).hide(""); //get and hide element 
    }); 
} 

window.onload = function() { 
    getStorage(); 
}; 

은 Xan하지 완벽한 접근 방식의 경우, 언급 한 바와 같이 페이지가 고정되어 있지 않지만 필요한 부분을 수행합니다.

Answer 1

이것은 매우 광범위한 질문입니다. 그 이유는 일반적으로 페이지의 요소를 정확하게 식별 할 수있는 방법이 없습니다 (특히 동적 인 경우).

모든 페이지에서 작동하는 "단일"솔루션은 없습니다. 그러나 요소를 찾아내는 방법을 고안 할 수 있다고 가정하면 DOM XPath을 조사해야합니다.

클래스/ID 이름보다 훨씬 일반적인 요소 찾기 방법을 설명하는 방법이 풍부합니다. 그리고 그것은 단지 문자열 일 뿐이므로 쉽게 저장할 수 있습니다. 이 설명이 있으면 using document.evaluate 요소를 찾을 수 있습니다.

단점은 요소의 "XPath"와 같은 것이 없다는 것입니다. 주어진 요소에 대해 자신 만의 방법을 만드는 방법을 생각해 내야합니다. 그렇게 말했듯이 자동적으로 그렇게하는 것은 거의 불가능합니다. 분명히 많은 일반적인 사례를 다루는 것을 환영하지만, 보편적 인 해결책을 찾는 것은 절망적입니다.

P. 요소의 "XPath"를 찾으려면 this question을 참조하십시오. 다시 말하지만 정적 페이지에서만 안정적으로 작동합니다.