6

ページ上の各要素のunqiueセレクターを取得できる必要があります。

たとえば、要素をクリックすると、次のようになります。

$(document).click(function(){
    var sel = getUniqueSel(this);
});

したがって、sel値をDBに格納した後、その値を取得して、次の方法で要素にアクセスすることができます。

var el = $(sel);

ページのHTML構造を変更したり、何も知らなかったり、すべての要素に一意のID(JSを使用)を追加したりすることはできません。これは非効率的です。

4

2 に答える 2

7

もう 1 つの方法は、DOM ツリーをたどって要素へのパスを作成することです。これを保存して、後でセレクターとして再び使用できます。

編集:コメントであなたの提案で回答を更新しました。利用可能な場合はIDを返すようになりました

JSBinの例にアクセスして、 を 2 回クリックしてくださいdocumentしかし、強調表示されていることに注意してください..

jQuery.fn.getPath = function () {
    if (this.length != 1) throw 'Requires one element.';
    var path, node = this;
    if (node[0].id) return "#" + node[0].id;
    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;
};
var sel;
$(document)
    .click(function (e, a) {
    if (!sel) {
        sel = $("#comment-21702402")
            .getPath();
        alert("Path is: " + sel + ", hiding the Element -> Click again to highlight");
    } else {
        $(sel)
            .css("background-color", "yellow");
    }
});
于 2013-03-12T12:55:46.173 に答える
0

これを行う 1 つの方法は、クリックされた要素で取得できるすべての情報を取得することです。したがって、データベースに保存するときに、たとえばテキストとして保存できます。クリックした要素が次の場合:<div> I'm a div </div>

$(document).click(function(){
    var tagName = $(this).prev().prop('tagName');
    var attributes = {}; 
    if( this.length ) {
        $.each( this[0].attributes, function( index, attr ) {
            attributes[ attr.name ] = attr.value;
        } ); 
    }
    var elText=$(this).html();
    saveToDB(tagName,attributes,elText);
});

あなたが持っている属性を使用して、または単に使用して、後で要素を見つけることができます

$(tagName+'['+attribute+'="'+value+'"]:contains("'+elText+'")')

これは役立つはずだと思います

于 2013-03-12T12:46:26.367 に答える