Убедитесь, что атрибут id элемента индивидуален - PullRequest
Новая
       2

Убедитесь, что атрибут id элемента индивидуален

0 голосов
/ 28 октября 2011

Я просто не могу понять логику, возможно, я слишком много думаю об этом!

Мне нужно убедиться, что атрибут скрипта id уникален, прежде чем я добавлю его в DOM.

Вот несколько примеров, чтобы показать вам, что мне нужно:

Если в элементе <head> у меня было 3 дочерних элемента script, например: 

<script id="script-0"></script>
<script id="script-1"></script>
<script id="script-2"></script>

Я бы хотел, чтобы мой новый элемент script имел id из "script-3"

Если бы у меня было 3 дочерних элемента script, например: 

<script id="script-0"></script>
<script id="script-2"></script>
<script id="script-3"></script>

Я хотел бы, чтобы мой новый script элемент имел id из "script-1" или "script-4"

И в этом случае: 

<script id="script-1"></script>
<script id="script-2"></script>

Я бы хотел, чтобы мой новыйЭлемент script имеет id из "script-0" или "script-3"

До тех пор, пока атрибуты id каждого элемента сценария уникальны!

В этом сценарии каждый элемент script фактически выполняет запрос JSONP, и поэтому, поскольку он асинхронный, другой элемент script может быть добавлен к DOM в промежуточный период, и ему потребуется собственный уникальный id.

После JSONP-запрос получил ответ, он удаляется из DOM, следовательно, пробелы в id, например, script-0, script-1, script-3, script-4 и script-6, какзапросы JSONP script-2 и script-5 могли получить ответ и были удалены из DOM.В этом случае я бы хотел, чтобы новый элемент script имел либо id script-2, script-5, либо, в худшем случае: script-7.

Надеюсь, это достаточно ясно!

Я просто не могу выработать логику, любая помощь будет очень признательна!

О, и только ванильный JS;нет jQuery и т. д., спасибо!

Я обещаю опубликовать ответ на вопрос в Stackoverflow за каждый ответ, опубликованный в ответ на этот вопрос!Обещай!

Ответы [ 2 ]

1 голос
/ 28 октября 2011

Действительно ли необходимо заполнить пробелы?

Я хотел бы представить, что с помощью счетчика и с простым приращением будет легче работать, особенно если учесть, что вы можете иметь до 9,007,199,254,740,992 уникальных запросов JSONP: 

var requestJSONP = (function () {
    var guid = 0;

    return function (url) {
        var id = 'script-' + guid++;

        var script = document.createElement('script');
        script.id = id;
        script.src = url;
        script.type = 'text/javascript';

        script.onload = function () {
            this.parentNode.removeChild(this);
        };

        document.getElementsByTagName('head')[0].appendChild(script);

        return id;
    };
})();

Закрытие является необязательным, но оно предотвратит изменение любого другого сценария guid.

Пример: 

var scriptId = requestJSONP('/request/resource?callback=handler');
1 голос
/ 28 октября 2011

Вы можете сделать что-то вроде этого: 

var scripts = document.getElementsByTagName('script'); // we're getting all scripts from page
var ids = [];
for (i in scripts) {  // iterate by them
    var id = scripts[i].id;  // take 'id' attribute from current script 
    if (id && id.match(/script-\d+/)) {  // check if id matches 'script-...' pattern
        ids.push( parseInt(id.substring(id.indexOf('-')+1),10) );  // take only nomber and convert it to a decimal number, push this number to ids array
    }
}
ids = ids.sort(function(a,b){return a > b;});  // sort array ASC
var lastId = ids.pop();   // take the last value from array
...