如何通过正则表达式收集 HTML-div 中的 url 文本？

Posted 2023-02-24

【中文标题】如何通过正则表达式收集 HTML-div 中的 url 文本？

【英文标题】：How to gather the url text inside HTML-div via regular expression?

【发布时间】：2019-08-11 07:19:12

【问题描述】：

我在 div 中有一个带有链接的字符串。如何使用正确的正则表达式进行解析？

我需要像这样获取这个值的数组：

[
"/media/filer_public/b6/49/b6491a4d-5c0d-4a0f-aa9c-b32ea39912c6/category-2.jpg", 
"/media/filer_public/93/65/9365c3bc-8649-4d9d-932e-144f16ed535c/category-3.jpg"
]

基础 html（示例）：

               <a href="/napolnye-pokrytiya/" class="category_cart">
                    <div class="category_cart__container">
                        <div style="background-image: url('/media/filer_public/b6/49/b6491a4d-5c0d-4a0f-aa9c-b32ea39912c6/category-2.jpg')" class="category_cart__thumbnail"></div>
                        <div class="category_cart__content">
                            <p class="category_cart__title">Напольные покрытия</p>
                        </div>
                    </div>
                </a>

                <a href="/oboi/" class="category_cart">
                    <div class="category_cart__container">
                        <div style="background-image: url('/media/filer_public/93/65/9365c3bc-8649-4d9d-932e-144f16ed535c/category-3.jpg')" class="category_cart__thumbnail"></div>
                        <div class="category_cart__content">
                            <p class="category_cart__title">Обои</p>
                        </div>
                    </div>
                </a>

【问题讨论】：

在HTML has some serious potential problems中使用正则表达式，我建议使用DOMDocument之类的东西，它可以理解标签的结构和上下文。

如果您要获取的字符串都在 background-image 样式中 - 使用 js 在元素上找到样式 attr 可能更容易。比如：***.com/questions/14013131/…

This question is being discussed on meta.

【参考方案1】：

你应该使用 DOMDocument 和 DOMXPath 或类似的东西，但如果你想用正则表达式完成，对于你给定的 html，这应该可以解决问题：

<?php 

$html_code = 
'<a href="/napolnye-pokrytiya/" class="category_cart">
    <div class="category_cart__container">
        <div style="background-image: url(\'/media/filer_public/b6/49/b6491a4d-5c0d-4a0f-aa9c-b32ea39912c6/category-2.jpg\')" class="category_cart__thumbnail"></div>
            <div class="category_cart__content">
                <p class="category_cart__title">Напольные покрытия</p>
            </div>
        </div>
</a>

<a href="/oboi/" class="category_cart">
    <div class="category_cart__container">
        <div style="background-image: url(\'/media/filer_public/93/65/9365c3bc-8649-4d9d-932e-144f16ed535c/category-3.jpg\')" class="category_cart__thumbnail"></div>
            <div class="category_cart__content">
                <p class="category_cart__title">Обои</p>
            </div>
        </div>
</a>';

//it will look for match between url(' and ')
preg_match_all('/url\(\'(.*?)\'\)/', $html_code, $matches_array);
echo '<pre>';
var_dump($matches_array);
echo '</pre>';

$your_array = array();
//matches including url(' and ') are stored in $matches_array[0], excluded in $matches_array[1] so
foreach($matches_array[1] as $match) 

    $your_array[] = $match;


echo '<pre>';
var_dump($your_array);
echo '</pre>';
?>

输出：

array(2) 
  [0]=>
  array(2) 
    [0]=>
    string(84) "url('/media/filer_public/b6/49/b6491a4d-5c0d-4a0f-aa9c-b32ea39912c6/category-2.jpg')"
    [1]=>
    string(84) "url('/media/filer_public/93/65/9365c3bc-8649-4d9d-932e-144f16ed535c/category-3.jpg')"
  
  [1]=>
  array(2) 
    [0]=>
    string(77) "/media/filer_public/b6/49/b6491a4d-5c0d-4a0f-aa9c-b32ea39912c6/category-2.jpg"
    [1]=>
    string(77) "/media/filer_public/93/65/9365c3bc-8649-4d9d-932e-144f16ed535c/category-3.jpg"
  

array(2) 
  [0]=>
  string(77) "/media/filer_public/b6/49/b6491a4d-5c0d-4a0f-aa9c-b32ea39912c6/category-2.jpg"
  [1]=>
  string(77) "/media/filer_public/93/65/9365c3bc-8649-4d9d-932e-144f16ed535c/category-3.jpg"