Как я могу получить несколько шестнадцатеричных значений, которые включены в строку запроса URL, используя jQuery?

Question

У меня есть тег изображения, который выглядит следующим образом:

<img src="http://www.example.com/render/pattern?obj=patterns/pattern_1&color=7F8C6C&obj=patterns/pattern_2&color=C8D9B0&obj=patterns/pattern_3&color=FFFFD1" width="100" height="100" alt="" />

Могу ли я использовать jQuery / Javascript для поиска атрибута src, чтобы найти текст «pattern_1 & color =», а затем получить 6 символов после этого? Если так, как бы я? Если нет, как еще я могу получить эти 3 шестнадцатеричных значения?

Спасибо

Answer 1

Да - просто используйте регулярное выражение JavaScript, чтобы извлечь именно эту часть URL:

jQuery("img").each(function(i) {
    m = i.src.match("pattern_1&color=([0-9A-F]{6})"); /* or ([^&]+) if you want to handle named colors */
    if (m) {
        console.log("Found img with color: " + m[1]);
    }
}

Answer 2

Вам нужен способ:

• парсинг произвольных параметров запроса из URL
• не выбрасывать дубликаты ключей

Первый ход:

function parseIt(url) {
    var params = {}; 
    url = (url.split('?')[1] || '');
    url.replace(/([^=&]+)=([^&]*)/g, function(m, key, val) { 
        key = decodeURIComponent(key);
        val = decodeURIComponent(val);
        params[key] = params[key] ? params[key].concat(val) : [val]
    });
    return params
}

Регулярное выражение и string.replace трюк от Джона Ресига, здесь .

Подключить его к своим изображениям с помощью jQuery очень просто:

$('img').each(function() {
    var colors = parseIt(this.src).color;
    alert(colors); // "7F8C6C,C8D9B0,FFFFD1"
})

Answer 3

Является ли этот URL примером или именно так будут структурированы аргументы URL? Я спрашиваю об этом, потому что вы можете проанализировать строку запроса с помощью простой функции, но для этого необходимо, чтобы ключи аргумента были уникальными. Так что, если это больше похоже на следующее:

?obj1=[value1]&color1=456986&obj2=[value2]&color2=828298

Тогда это будет работать. Вот ссылка с очень простой JS-функцией, которую вы можете использовать для извлечения именованной переменной из строки запроса:

http://www.idealog.us/2006/06/javascript_to_p.html