我正在创建一个php脚本,从https://gtmetrix.com/reports/example.com/a_unique_code中拖动推荐,去除图像并推荐图像的宽度和高度,然后自动优化我的图像。到目前为止,我的剪贴簿脚本如下;
$content = file_get_contents('https://gtmetrix.com/reports/example.com/a_unique_code');
$pattern = '~<ul>(.*?)</ul>~s';
preg_match_all($pattern, $content, $out);
preg_match_all($pattern, $out[0][0], $out);
$j=0;
foreach($out[0] as $array)
{
$str_arr = preg_split ("/<li>/", $array);
}
foreach($str_arr as $string)
{
$regex = '/https?\:\/\/[^\",]+/i';
preg_match_all($regex, $string, $urls);
$regex = '\s(\d+)[a-zA-Z](\d+)\s';
preg_match_all($regex, $string, $sizes);
}
在建议之后,我已将脚本更改为使用Dom分析器,如下;
$html = file_get_contents('https://gtmetrix.com/reports/example.com/a_unique_code');
$document = new DOMDocument();
$document->loadHTML($html);
$xpath = new DOMXpath($document);
$stack = array();
$expression = './/tr[contains(concat(" ", normalize-space(@class), " "), " rules-details ")]';
foreach ($xpath->evaluate($expression) as $tr)
{
array_push($stack, $tr->nodeValue);
}
$i=0;
foreach ($stack as $string)
{
$search_string = $string;
$find = 'reduction';
$pos = strpos($search_string, $find);
if($pos===false){}
else
{
$string = str_replace("What's this mean?","",$string);
$string = trim(preg_replace("/\s+/", " ", $string));
$string_array = explode(').', $string);
for($i=0;$i<sizeof($string_array);$i++)
{
$search_string = $string_array[$i];
$find = 'The following images are resized in HTML or CSS.';
$pos = strpos($search_string, $find);
if($pos===false){}
else
{
unset($string_array[$i]);
}
$find = "Optimize the following images to reduce their size by";
$pos = strpos($search_string, $find);
if($pos===false){}
else
{
$current_index = $string_array[$i];
$array_size = sizeof($string_array);
for($j=$current_index;$j<$array_size;$j++)
{
unset($string_array[$i]);
}
}
echo '<pre>'.$string_array[$i];
}
}
}
给出以下字符串,提取URL和第二个图像尺寸的正则表达式将是什么;
$string = https://www.example.com/0029.jpg is resized in HTML or CSS from 300x623 to 123x200. Serving a scaled image could save 51.3KiB (86% reduction.";
或者,只是第二个图像尺寸,因为我已经可以提取网址,所以在提取第二个图像尺寸时遇到问题。
根据请求,我尝试解析的HTML如下;
<tr class="rules-details" style="display: none">
<td colspan="4">
<a href="/serve-scaled-images.html" class="rule-help btn hover-tooltip" data-tooltip-interactive data-tooltip-max-width="450" title="<h4>Serve scaled images</h4><p>Serving appropriately-sized images can save many bytes of data and improve the performance of your webpage, especially on low-powered (eg. mobile) devices.</p><p class="rule-help-tooltip-more"><a href="/serve-scaled-images.html">Read more</a></p>"><i class="sprite-question"></i><span class="resp-hidden">What's this mean?</span></a>
<div>
<p>The following images are resized in HTML or CSS. Serving scaled images could save 1.3MiB (45% reduction).
<ul>
<li><a href="https://www.example.com/Pictures/thumbs/0029.jpg" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/0029.jpg</a> is resized in HTML or CSS from 300x623 to 123x200. Serving a scaled image could save 51.3KiB (86% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumbs/0133.jpg" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/0133.jpg</a> is resized in HTML or CSS from 300x578 to 135x200. Serving a scaled image could save 44.0KiB (84% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumbs/0075.jpg" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/0075.jpg</a> is resized in HTML or CSS from 300x390 to 176x200. Serving a scaled image could save 43.2KiB (69% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumbs/0057.jpg" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/0057.jpg</a> is resized in HTML or CSS from 300x436 to 174x200. Serving a scaled image could save 35.0KiB (73% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumb/thumb.png" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/thumb.png</a> is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 31.4KiB (78% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumb/thumb.png" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/thumb.png</a> is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 30.9KiB (78% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumb/thumb.png" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/thumb.png</a> is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 30.7KiB (78% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumb/thumb.png" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/thumb.png</a> is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 30.7KiB (78% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumbs/0093.jpg" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/0093.jpg</a> is resized in HTML or CSS from 300x458 to 138x200. Serving a scaled image could save 28.9KiB (79% reduction).</li>
</ul>
</p>
</div>
</td>
</tr>
旁注,我将优化此脚本,它只是原型形式。
$html = '<tr class="rules-details" style="display: none">
<td colspan="4">
<a href="/serve-scaled-images.html" class="rule-help btn hover-tooltip" data-tooltip-interactive data-tooltip-max-width="450" title="<h4>Serve scaled images</h4><p>Serving appropriately-sized images can save many bytes of data and improve the performance of your webpage, especially on low-powered (eg. mobile) devices.</p><p class="rule-help-tooltip-more"><a href="/serve-scaled-images.html">Read more</a></p>"><i class="sprite-question"></i><span class="resp-hidden">What\'s this mean?</span></a>
<div>
<p>The following images are resized in HTML or CSS. Serving scaled images could save 1.3MiB (45% reduction).
<ul>
<li><a href="https://www.example.com/Pictures/thumbs/0029.jpg" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/0029.jpg</a> is resized in HTML or CSS from 300x623 to 123x200. Serving a scaled image could save 51.3KiB (86% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumbs/0133.jpg" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/0133.jpg</a> is resized in HTML or CSS from 300x578 to 135x200. Serving a scaled image could save 44.0KiB (84% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumbs/0075.jpg" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/0075.jpg</a> is resized in HTML or CSS from 300x390 to 176x200. Serving a scaled image could save 43.2KiB (69% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumbs/0057.jpg" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/0057.jpg</a> is resized in HTML or CSS from 300x436 to 174x200. Serving a scaled image could save 35.0KiB (73% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumb/thumb.png" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/thumb.png</a> is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 31.4KiB (78% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumb/thumb.png" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/thumb.png</a> is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 30.9KiB (78% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumb/thumb.png" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/thumb.png</a> is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 30.7KiB (78% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumb/thumb.png" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/thumb.png</a> is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 30.7KiB (78% reduction).</li>
<li><a href="https://www.example.com/Pictures/thumbs/0093.jpg" target="_blank" rel="nofollow noopener noreferrer">https://www.example.com/Pictures/thumbs/0093.jpg</a> is resized in HTML or CSS from 300x458 to 138x200. Serving a scaled image could save 28.9KiB (79% reduction).</li>
</ul>
</p>
</div>
</td>
</tr>';
$doc = new DOMDocument();
$html = @$doc->loadHTML($html);
$links = (new DOMXPath($doc))->query('//tr/td/div//ul/li');
foreach ($links as $link) {
printf('%s%s', $link->nodeValue, PHP_EOL);
}
输出
https://www.example.com/Pictures/thumbs/0029.jpg is resized in HTML or CSS from 300x623 to 123x200. Serving a scaled image could save 51.3KiB (86% reduction). https://www.example.com/Pictures/thumbs/0133.jpg is resized in HTML or CSS from 300x578 to 135x200. Serving a scaled image could save 44.0KiB (84% reduction). https://www.example.com/Pictures/thumbs/0075.jpg is resized in HTML or CSS from 300x390 to 176x200. Serving a scaled image could save 43.2KiB (69% reduction). https://www.example.com/Pictures/thumbs/0057.jpg is resized in HTML or CSS from 300x436 to 174x200. Serving a scaled image could save 35.0KiB (73% reduction). https://www.example.com/Pictures/thumbs/thumb.png is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 31.4KiB (78% reduction). https://www.example.com/Pictures/thumbs/thumb.png is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 30.9KiB (78% reduction). https://www.example.com/Pictures/thumbs/thumb.png is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 30.7KiB (78% reduction). https://www.example.com/Pictures/thumbs/thumb.png is resized in HTML or CSS from 148x100 to 68x46. Serving a scaled image could save 30.7KiB (78% reduction). https://www.example.com/Pictures/thumbs/0093.jpg is resized in HTML or CSS from 300x458 to 138x200. Serving a scaled image could save 28.9KiB (79% reduction).