Question

我需要使用jQuery获取元素背景图像的URL：

var foo = $('#id').css('background-image');

这导致类似url("http://www.example.com/image.gif")的内容。我怎样才能从中获得“http://www.example.com/image.gif”部分？ typeof foo说它是一个字符串，但url()部分让我认为JavaScript和/或jQuery有一个特殊的URL类型，我应该能够获得foo.toString()的位置。但这不起作用。

Answer 1

在这种情况下，您可能需要考虑正则表达式：

var urlStr = 'url("http://www.foo.com/")';
var url = urlStr.replace(/^url\(['"]?([^'"]*)['"]?\);?$/, '$1');

这个特殊的正则表达式允许您使用url(http://foo.bar/)或url("http://foo.bar/")等格式，单引号而不是双引号，或者最后可能使用分号。

Answer 2

请注意，不同的浏览器实现可能会以不同的格式返回字符串。例如，一个浏览器可以返回双引号，而另一个浏览器可以返回没有引号的值。这使得解析变得很麻烦，尤其是当您认为引号作为URL字符有效时。

我会说最好的方法是一张好的旧支票和slice()：

var imageUrlString = $('#id').css('background-image'),
    quote = imageUrlString.charAt(4),
    result;

if (quote == "'" || quote == '"')
    result = imageUrlString.slice(5, -2);
else
    result = imageUrlString.slice(4, -1);

假设浏览器返回一个有效的字符串，这不会失败。即使返回空字符串（即没有背景图像），结果也是空字符串。

Answer 3

您可以在每个"拆分字符串并获取第二个元素：

var foo = $('#id').css('background-image').split('"')[1];

注意：如果您的网址包含引号，则无效。

Answer 4

没有特殊的URL类型 - 它是表示CSS url值的字符串。您可以使用正则表达式取回URL：

var foo = ${'#id').css('background-image');
var url = foo.match(/url\(['"](.*)['"]\)/)[1];

（正则表达式并非万无一失，但它应该可以解决任何jQuery返回的问题）

Answer 5

如果它始终相同，我只需要带有不带前缀的URL的子字符串。

例如，如果它总是：

url("<URL>")
url("<otherURL>")

它始终是len - 2

的字符串的第5个索引

不是最好的，但如果你不担心其他字符串格式，可能比正则表达式更快。</ p>

如何从网址（“http://www.example.com”）中提取网址？

5 个答案: