使用javascript从HTML网页中提取图像url

extract image url using javascript from a HTML webpage

本文关键字:提取 图像 url 网页 javascript HTML 使用      更新时间:2023-09-26

我有一个保存为字符串的html部分的来源:

var str= '<div class="quizdisplay themestylename theme_db_primarykey">
        <h1>What Power Would Suit You Best</h1>
        <p class="inline_byline"">Created by <a class="url fn" href="/user/xQUANTUMNxNOVAx/profile">xQUANTUMNxNOVAx</a></p>
        <div class="metacrumb">
                  <dl>
                    <dt>Tagged:</dt>
                      <dd><a class="tag" rel="tag" href="/tags/dark" title="dark">dark</a></dd>, <dd><a class="tag" rel="tag"
 href="/tags/personality" title="personality">personality</a></dd>,
 <dd><a class="tag" rel="tag" href="/tags/air"
 title="air">air</a></dd>, <dd><a class="tag" rel="tag"
 href="/tags/power" title="power">power</a></dd>, <dd><a class="tag"
 rel="tag" href="/tags/fire" title="fire">fire</a></dd>, <dd><a
 class="tag" rel="tag" href="/tags/water" title="water">water</a></dd>,
 <dd><a class="tag" rel="tag" href="/tags/energy"
 title="energy">energy</a></dd>, <dd><a class="tag" rel="tag"
 href="/tags/earth" title="earth">earth</a></dd>, <dd><a class="tag"
 rel="tag" href="/tags/lightning" title="lightning">lightning</a></dd>,
 <dd><a class="tag" rel="tag" href="/tags/telekinesis"
 title="telekinesis">telekinesis</a></dd>
                   </dl>
                </div>
        <div id="itemresults" class="quidget">
            <p>
                5493 other people got this result!
                That's 34%
            </p>
                        <a class="button viewallresults">View all results</a>
                            <a href="/quizzes" class="button" style="line-height:23px;width:150px;">Take another quiz!</a>
        </div>
        <h3 class="aquestion">Water/Ice.</h3>
                <img src="/user_images/X/XQ/XQU/XQUANTUMNXNOVAX/1346304322_6798_full.jpeg"
 alt="result image" />
        <p>You go with the flow, following the motions of the world around you. You're calming and relaxing but have an aggressive side to
 you when necessary. You can be in tune with people easily, or can be
 completely cold hearted. People typically love you, and need you the
 most.</p>
 </div>';

如何使用javascript从这个字符串中提取图像url?

jquery

var srcArray = [];
$(str).find('img').each(function(){
   src = $(this).attr('src');
   srcArray.push(src);
});

或者您可以使用Regex:

var regex = /(?<=<img src=").*?(?=")/gm;
src = regex.match(str);
alert(src);

这个链接上的examle。

因为它是HTML。您可以将所有内容插入DOM(隐藏),并使用jQuery获取图像url,这有点麻烦,但可能是最简单的方法。

您也可以使用正则表达式来搜索图像标签并从中获取url。