jquery를 사용하여 요소를 참조하는 가장 좋은 방법은 무엇입니까?

Question

jquery를 사용하여 개체 (this)에 대한 참조를 저장하는 방법을 알고 싶습니다. 내 말은, 예를 들어, 내 사용자가 페이지의 요소를 클릭했을 때 웹 서버에 객체 참조를 보내고 다음에 사용자가 서버를 호출하면 브라우저에 저장된 참조를 다시 보내고 다른 작업을 수행하기를 원합니다. fadeIn() ... 지금까지 JSON.stringify (this) 및 JSON.stringify ($ (this))를 사용하여 시도했지만 두 가지 모두 작동하지 않는 것 같습니다. 나는 또한 elemen't ID와 클래스 및 유형을 저장하려고 했으므로 다음 번에 사용자가 선택기를 사용할 수는 있지만, 모든 웹 사이트에서 스크립트를 사용하기 때문에 셀렉터를 사용하는 것이 이상적이지 않을 수 있습니다. 요소에 대한 정확한 참조를 얻고 서버로 보내려면 어떤 방법이 있습니까?

Answer 1

아니는 DOM 요소에 대한 참조는 단지 하나의 DOM 인스턴스 (그래서 당신은 같은 페이지를 다시로드 경우에도 참조가 더 이상 작동하지 않습니다) 내에서 작동합니다. 선택기를 사용해야합니다. 당신은 페이지의 구조가 변경되지 않도록 경우, 같은 요소를 얻을 수있는 가장 쉬운 방법은 이것이다 :

// Get numeric index of element on page. 
var index = $('*').index(this); 

// Restore element. 
var $this = $('*').eq(index); 

당신은 가능한 ID와 클래스를 사용하여 페이지를 변경하는 것이 더 안전 할 수 있습니다. 클래스/ID를 그것의 간단한 버전 의존하지 않는 사용자들은 여기 http://paste.blixt.org/297640

:

이 스크립트에서보세요

jQuery.fn.getPath = function() { 
    if (this.length != 1) throw 'Requires one element.'; 

    var path, node = this; 
    while (node.length) { 
     var realNode = node[0], name = realNode.localName; 
     if (!name) break; 
     name = name.toLowerCase(); 

     var parent = node.parent(); 

     var siblings = parent.children(name); 
     if (siblings.length > 1) { 
      name += ':eq(' + siblings.index(realNode) + ')'; 
     } 

     path = name + (path ? '>' + path : ''); 
     node = parent; 
    } 

    return path; 
}; 

은 다음과 같이 사용합니다 :

// Get selector for element. 
var path = $(this).getPath(); 

// Get element using selector. 
var $this = $(path); 

Answer 2

당신이 묻는 것을 정확하게 할 수있는 방법이 없다고 생각하지만,이 방법으로 저장하려는 요소에 ID를 두는 것이 좋습니다. 그런 다음 ajax를 사용하여 서버에서 해당 ID를 저장하고 나중에 검색 할 수 있습니다. 나는 이것이 당신이 지시 한대로 "모든 웹 사이트"에서 작동 할 것이라고 생각하지 않는다

var saveId = $(this).attr('id'); 

,하지만 당신이 사이트를 제어 할 경우, 모든 확인 할 수 있습니다

당신의 선택은 다음과 같이 보일 것입니다 저장하려는 요소에는 ID가 있고 페이지의 모든 ID는 고유해야하므로 해당 조건 내에서이를 수행 할 수 있어야합니다.

Answer 3

selector 필드를 저장할 수 있으므로 나중에 선택할 수 있습니다. 이처럼 :

var Elements = $('body').find('.container').find('div.controls'); // Just some complex selection 
... 
var ToSave = Elements.selector; 
AJAXSave('Elements', ToSave); 
// ToSave will be 'body .container div.controls' which is the elements we are talking about. 
... 
var LastElements = $(AJAXLoad('Elements'));