21

我正在尝试将所有图像元素匹配为字符串，

这是我的正则表达式：

html.match(/<img[^>]+src="http([^">]+)/g);

这有效，但我想提取src所有图像。所以当我在这个字符串上执行正则表达式时：

<img src="http://static2.ccn.com/ccs/2013/02/img_example.jpg />

它返回：

"http://static2.ccn.com/ccs/2013/02/img_example.jpg"

4

6 回答 6

25

您需要使用捕获组()来提取网址，如果您想要全局匹配g，即不止一次，当使用捕获组时，您需要exec在循环中使用（match全局匹配时忽略捕获组）。

例如

var m,
    urls = [], 
    str = '<img src="http://site.org/one.jpg />\n <img src="http://site.org/two.jpg />',
    rex = /<img[^>]+src="?([^"\s]+)"?\s*\/>/g;

while ( m = rex.exec( str ) ) {
    urls.push( m[1] );
}

console.log( urls ); 
// [ "http://site.org/one.jpg", "http://site.org/two.jpg" ]
于 2013-02-21T22:29:24.683 回答
8 
var myRegex = /<img[^>]+src="(http:\/\/[^">]+)"/g;
var test = '<img src="http://static2.ccn.com/ccs/2013/02/CC_1935770_challenge_accepted_pack_x3_indivisible.jpg" />';
myRegex.exec(test);
于 2013-02-18T15:16:49.913 回答
5

正如 Mathletics 在评论中提到的，还有其他更直接的方法可以从标签中检索src属性，<img>例如通过 id、name、class 等检索对 DOM 节点的引用，然后仅使用您的引用来提取您的信息需要。如果您需要对所有<img>元素执行此操作，则可以执行以下操作：

var imageTags = document.getElementsByTagName("img"); // Returns array of <img> DOM nodes
var sources = [];
for (var i in imageTags) {
   var src = imageTags[i].src;
   sources.push(src);
}

但是，如果您有一些限制迫使您使用正则表达式，那么提供的其他答案就可以了。

于 2013-02-18T15:18:50.500 回答
2

也许这就是您正在寻找的：

我所做的只是稍微修改了您的正则表达式，然后使用该exec函数来获取匹配字符串的数组。如果您有超过 1 场比赛，其他比赛将继续results[2]，results[3]...

var html = '<img src="http://static2.ccn.com/ccs/2013/02/CC_1935770_challenge_accepted_pack_x3_indivisible.jpg" />';

var re = /<img[^>]+src="http:\/\/([^">]+)/g
var results = re.exec(html);

var source = results[1];
alert(source);
于 2013-02-18T15:15:27.320 回答
1

您可以使用 html 解析器并完全避免使用正则表达式。

var parser = require('node-html-parser');

var html = '<img src="http://static2.ccn.com/ccs/2013/02/CC_1935770_challenge_accepted_pack_x3_indivisible.jpg" />'

parser.parse(html).querySelector('img').getAttribute('src')

=> 'http://static2.ccn.com/ccs/2013/02/CC_1935770_challenge_accepted_pack_x3_indivisible.jpg'
于 2021-08-31T14:28:48.153 回答
0

您可以使用组src访问该值

                                                   |->captured in group 1
                                   ----------------------------------                
var yourRegex=/<img[^>]+src\s*=\s*"(http://static2.ccn.com/ccs[^">]+)/g;
var match = yourRegex.exec(yourString);
alert(match[1]);//src value
于 2013-02-18T15:14:40.283 回答