2013-08-30 7 views
0

Я делаю редактор, где, когда пользователь нажимает на текст или что-либо в html-документе, я его изменяю и записываю изменения в базе данных. Это виджет, который я делаю. Таким образом, это мой вопрос. Предположим, у меня есть HTML элемент следующей структуры:Как получить уникальный селектор элементов

<html> 
    <table> 
    <tr> 
     <td>Apple</td> 
     <td>Pear</td> 
    </tr> 
    <tr> 
     <td>Chicken</td> 
     <td>Beef</td> 
    </tr> 
    </table> 
    <div id="one"> 
     <p>Red</p> 
     <p>Orange</p> 
    </div> 
    <div class="two"> 
     <p>Green</p> 
     <p>Purple</p> 
    </div> 
    <div class="two"> 
     <p>Black</p> 
     <p>Blue</p> 
    </div> 
</html> 

Когда пользователь щелкает Apple, единственный путь (Jquery):

table:eq(0)>tr:eq(0)>td:eq(1) 

Пусть пользователь щелкает красный, единственный путь (Jquery) :

div#one:eq(o) > p:eq(0) 

Есть ли какие-либо плагины, доступные для однозначной идентификации селекторов?

В настоящее время я использую эту функцию:

function getUniquePath2(node){ 
        var parentEls = node.parentsUntil('[id]').add(node.closest('[id]')) 
        .map(function() { 
         return this.tagName + (this.id ? '#' + this.id : ""); 
        }) 
        .get().join(">"); 

        return parentEls; 
       } 

Однако выше не будет поддерживать, и я исследовал в течение 4-х дней, и я не получить представление о том, как я должен это сделать. Причина, по которой я это делаю, потому что я хочу отслеживать изменения пользователя и изменять элементы в соответствии с проектом, который сделал пользователь. Проблема в том, что некоторые элементы не имеют идентификаторов, а xpath конфликтует с другими элементами. Например, если я хочу изменить Green. Как это будет уникально?

+0

Возможно, этот каркас может решить вашу проблему http://angularjs.org/ – gotqn

+0

How.Please расскажите мне, где в этих рамках? – madi

+0

Есть много подобных вопросов, подобных этому на S.O. – pleasedontbelong

ответ

1

Как насчет этого?

var getUniquePath = function(node) { 

    var parts = [ ]; 

    $(node).parents().each(function(index, element) { 
     parts .push(element.tagName + '[' + $(element).index() + ']'); 
    }); 

    return parts.join('', parts.reverse()); 
} 
+0

не следует использовать фильтр 'eq' вместо скобок:' element.tagName + ': eq (' + $ (element) .index() + ')' ' –

+0

Используемый синтаксис не имеет большого значения, Я просто даю направление. Если целью является создание селектора, то да, это должно быть так, но это детали. – Virus721

+0

Я просто говорю, что ваш ответ не завершен *. Это хорошо; не проверили его, но я бы точно это сделал. –

Смежные вопросы