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＆amp; color =”然后检索6个字符？如果是这样，我怎么样？如果没有，我还能如何检索这3个十六进制值？

由于

Answer 1

是的 - 只需使用JavaScript正则表达式来提取网址的那一部分：

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

您需要一种方法：

解析来自网址的任意查询参数
不要丢弃重复的密钥

首先去：

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技巧来自John Resig，here。

使用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

如何使用jQuery检索URL查询字符串中包含的几个十六进制值？

3 个答案: