如果不为空则替换 alt 标签
Replace alt tag if its not empty
我有一个正则表达式条件,如果图像 alt 标签为空则替换它们。
// <img src="test1.jpg" alt="">
$replacement = 'HELLO';
$pattern ='~(<img.*? alt=")("[^>]*>)~i';
$content = preg_replace($pattern, $replacement, $content);
// output <img src="test1.jpg" alt="HELLO">
我正在尝试寻找一种方法,如果 alt 标记不为空,则它应该替换整个字符串。我试过这个但是它会在开头添加单词而不是替换。
// <img src="test2.jpg" alt="my alternative text">
$replacement = 'HELLO';
$pattern ='~(<img.*? alt=")(.+/S.+>)~i';
$content = preg_replace($pattern, $replacement, $content);
// output <img src="test2.jpg" alt="HELLOmy alternative text">
虽然我希望输出为 <img src="test2.jpg" alt="HELLO">
编辑:我之前尝试过 DOM 解析器方法,但几乎没有问题。这是代码。
function replaceALT($content) {
global $post;
$post = get_post($post->ID);
$content = $post->post_content;
$alt_keyword = "HELLO";
$dom = new DOMDocument();
$dom->loadHTML($content);
$images = $dom->getElementsByTagName('img');
foreach ( $images as $image) {
if (empty($image->getAttribute("alt"))) {
$image->setAttribute('alt', $alt_keyword);
}
}
$content = $dom->saveHTML();
return $content;
}
add_filter('the_content', 'replaceALT');
几乎没有问题。出于某种原因,它正在修改 post 内容。 <p>
标签已删除并替换为 <br>
。我使用 return wpautop( $content );
解决了这个问题。另一个问题是 img
自定义数据已被删除。例如,WordPress TwentySeventeen 主题 return 像这样的图像 post.
<img src="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg" alt="" width="3264" height="2448" class="alignleft size-full wp-image-24" srcset="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg 3264w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-300x225.jpg 300w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-768x576.jpg 768w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-1024x768.jpg 1024w" sizes="(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px" />
但是 DOM 解析器 return 像这样的图像。
<img src="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg" alt="HELLO" width="3264" height="2448" class="alignleft size-full wp-image-24">
并且因为我需要替换 post 内容中的 alt 标签 div。
<!-- default output -->
<div class="entry-content">
<p><img src="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg" alt="" width="3264" height="2448" class="alignleft size-full wp-image-24" srcset="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg 3264w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-300x225.jpg 300w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-768x576.jpg 768w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-1024x768.jpg 1024w" sizes="(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px" />Lorem ipsum dolor sit amet</p>
</div><!-- .entry-content -->
它是这样 returning 输出的。
<!-- DOM parser output -->
<div class="entry-content">
<p><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd"><br />
<html><body><img src="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg" alt="HELLO" width="3264" height="2448" class="alignleft size-full wp-image-24">Lorem ipsum dolor sit amet</body></html></p>
</div><!-- .entry-content -->
有人可以帮我解决这个问题吗?谢谢
这里最好的解决方案似乎是
'~(<img\s(?:[^<]*?\s)?alt=")[^"]+("[^<]*?>)~i'
详情
(<img\s(?:[^<]*?\s)?alt=")
- 第 1 组:
<img
- 文字子串
\s
- 一个空格
(?:[^<]*?\s)?
- 除 <
之外的 0+ 个字符的可选子字符串,尽可能少,后跟空格
alt="
- 文字子串
[^"]+
- "
以外的 1 个或多个字符
("[^<]*?>)
- 第 2 组:
"
- 一个"
[^<]*?
- <
以外的任何 0+ 个字符尽可能少
>
- 一个 >
字符。
我有一个正则表达式条件,如果图像 alt 标签为空则替换它们。
// <img src="test1.jpg" alt="">
$replacement = 'HELLO';
$pattern ='~(<img.*? alt=")("[^>]*>)~i';
$content = preg_replace($pattern, $replacement, $content);
// output <img src="test1.jpg" alt="HELLO">
我正在尝试寻找一种方法,如果 alt 标记不为空,则它应该替换整个字符串。我试过这个但是它会在开头添加单词而不是替换。
// <img src="test2.jpg" alt="my alternative text">
$replacement = 'HELLO';
$pattern ='~(<img.*? alt=")(.+/S.+>)~i';
$content = preg_replace($pattern, $replacement, $content);
// output <img src="test2.jpg" alt="HELLOmy alternative text">
虽然我希望输出为 <img src="test2.jpg" alt="HELLO">
编辑:我之前尝试过 DOM 解析器方法,但几乎没有问题。这是代码。
function replaceALT($content) {
global $post;
$post = get_post($post->ID);
$content = $post->post_content;
$alt_keyword = "HELLO";
$dom = new DOMDocument();
$dom->loadHTML($content);
$images = $dom->getElementsByTagName('img');
foreach ( $images as $image) {
if (empty($image->getAttribute("alt"))) {
$image->setAttribute('alt', $alt_keyword);
}
}
$content = $dom->saveHTML();
return $content;
}
add_filter('the_content', 'replaceALT');
几乎没有问题。出于某种原因,它正在修改 post 内容。 <p>
标签已删除并替换为 <br>
。我使用 return wpautop( $content );
解决了这个问题。另一个问题是 img
自定义数据已被删除。例如,WordPress TwentySeventeen 主题 return 像这样的图像 post.
<img src="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg" alt="" width="3264" height="2448" class="alignleft size-full wp-image-24" srcset="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg 3264w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-300x225.jpg 300w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-768x576.jpg 768w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-1024x768.jpg 1024w" sizes="(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px" />
但是 DOM 解析器 return 像这样的图像。
<img src="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg" alt="HELLO" width="3264" height="2448" class="alignleft size-full wp-image-24">
并且因为我需要替换 post 内容中的 alt 标签 div。
<!-- default output -->
<div class="entry-content">
<p><img src="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg" alt="" width="3264" height="2448" class="alignleft size-full wp-image-24" srcset="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg 3264w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-300x225.jpg 300w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-768x576.jpg 768w, http://localhost/wp/wp-content/uploads/2018/08/image-1356510220-1024x768.jpg 1024w" sizes="(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px" />Lorem ipsum dolor sit amet</p>
</div><!-- .entry-content -->
它是这样 returning 输出的。
<!-- DOM parser output -->
<div class="entry-content">
<p><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd"><br />
<html><body><img src="http://localhost/wp/wp-content/uploads/2018/08/image-1356510220.jpg" alt="HELLO" width="3264" height="2448" class="alignleft size-full wp-image-24">Lorem ipsum dolor sit amet</body></html></p>
</div><!-- .entry-content -->
有人可以帮我解决这个问题吗?谢谢
这里最好的解决方案似乎是
'~(<img\s(?:[^<]*?\s)?alt=")[^"]+("[^<]*?>)~i'
详情
(<img\s(?:[^<]*?\s)?alt=")
- 第 1 组:<img
- 文字子串\s
- 一个空格(?:[^<]*?\s)?
- 除<
之外的 0+ 个字符的可选子字符串,尽可能少,后跟空格alt="
- 文字子串
[^"]+
-"
以外的 1 个或多个字符
("[^<]*?>)
- 第 2 组:"
- 一个"
[^<]*?
-<
以外的任何 0+ 个字符尽可能少>
- 一个>
字符。