Имеет ли jQuery эквивалент Element.identify в Prototype?

Question

Есть ли встроенный метод или плагин дефакто по умолчанию, который позволяет автоматически назначать уникальный идентификатор элементу в jQuery, или вам нужно реализовать что-то подобное самостоятельно? Я ищу jQuery, эквивалентный Методу идентификации прототипа

Вот пример. У меня есть какая-то структура HTML на странице, которая выглядит следующим образом

<span id="prefix_1">foo bar</span>
...
<div id="foo">
   <span></span>
   <span></span>
   <span></span>
</div>

Я хочу назначить каждому из диапазонов идентификатор, который будет уникальным для страницы. Итак, после вызова что-то вроде этого

$('#foo span').identify('prefix');   //fake code, no such method

Визуализированный DOM будет выглядеть примерно так

<span id="prefix_1">foo bar</span>
...
<div id="foo">
   <span id="prefix_2"></span>
   <span id="prefix_3"></span>
   <span id="prefix_4"></span>
</div>

Есть ли что-нибудь официальное / надежное для jQuery или это большинство разработчиков jQuery запускают самостоятельно?

Answer 1

jQuery.fn.identify = function(prefix) {
    var i = 0;
    return this.each(function() {
        if(this.id) return;
        do { 
            i++;
            var id = prefix + '_' + i;
        } while($('#' + id).length > 0);            
        $(this).attr('id', id);            
    });
};

$('span').identify('test');

Проверено это на:

<span id='test_2'></span>
<span>test1</span>
<span>test2</span>
<span>test3</span>

Превратил его в:

<span id="test_2"></span>
<span id="test_1">test1</span>
<span id="test_3">test2</span>
<span id="test_4">test3</span>

Answer 2

Не знаю, но вы могли бы сделать это самостоятельно, добавив атрибут id и указав GUID.

Чтобы добавить атрибут:

$(foo).attr( "id", createGuid() );

Для реализации createGuid(), см. Этот вопрос .

Обратите внимание, что вы можете легко превратить это в плагин jQuery , чтобы эта функция (можно даже назвать ее identify()) была доступна для любого выражения $-.

Answer 3

На основании решения Паоло:

jQuery.fn.identify = function(prefix) {
    var i = 0;
    return this.each(function() {
        if($(this).attr('id')) return;
        do { 
            i++;
            var id = prefix + '_' + i;
        } while($('#' + id).length > 0);            
        $(this).attr('id', id);            
    });
};

$('span').identify('test');

Небольшое изменение, которое не позволит пересчитать уже использованные идентификаторы.

Answer 4

Я бы немного изменил данную функцию и сделал бы это:

jQuery.fn.identify = function(prefix) {
    var i = 0;
    return this.each(function() {
        if($(this).attr('id')) return;
        do { 
            i++;
            var id = prefix + '_' + i;
        } while(document.getElementById(id) != null);            
        $(this).attr('id', id);            
    });
};

Идентификаторы могут содержать специальные символы, которые должны быть экранированы для правильной работы с движком селектора CSS jQuery - например, ".". Поэтому вместо того, чтобы находить их и избегать, проще и быстрее заменить их методом документа.

Answer 5

Может быть, попробовать

$("#foo span").each(function(){
   $(this).attr("id", "prefix_" + $(this).parent().index($(this)));
});