English
English
In web development, it’s common to need cleaning or filtering HTML content to ensure that page displays are not disrupted by irrelevant tags, especially when dealing with user-submitted content that may contain unsafe or unnecessary HTML tags. In PHP, the strip_tags function is a commonly used tool that helps remove specific tags from an HTML string.
However, when working with HTML containing SVG images or other complex elements, we may want to remove certain tags while preserving useful structure and content. For example, removing the SVG tags but keeping the text and other structure inside.
PHP’s strip_tags function removes all HTML tags by default. Its syntax is as follows:
<span><span><span class="hljs-title function_ invoke__">strip_tags</span></span><span>(</span><span><span class="hljs-keyword">string</span></span><span> </span><span><span class="hljs-variable">$str</span></span><span>, </span><span><span class="hljs-keyword">string</span></span><span>|</span><span><span class="hljs-literal">null</span></span><span> </span><span><span class="hljs-variable">$allowed_tags</span></span><span> = </span><span><span class="hljs-literal">null</span></span><span>): </span><span><span class="hljs-keyword">string</span></span><span>
</span></span>$str: The HTML string to be processed.
$allowed_tags: Optional parameter specifying which tags to keep. If empty, all tags are removed.
For example:
<span><span><span class="hljs-variable">$html</span></span><span> = </span><span><span class="hljs-string">"<p>This is a <b>bold</b> paragraph with an <a href='#'>anchor</a> link.</p>"</span></span><span>;
</span></span><span><span><span class="hljs-variable">$cleaned_html</span></span><span> = </span><span><span class="hljs-title function_ invoke__">strip_tags</span></span><span>(</span><span><span class="hljs-variable">$html</span></span><span>);
</span></span>The output will be:
<span><span>This </span><span><span class="hljs-keyword">is</span></span><span> a bold paragraph </span><span><span class="hljs-keyword">with</span></span><span> an anchor link.
</span></span>By default, strip_tags removes all HTML tags. But if we want to keep certain tags (like or ), we can specify them in the second parameter:
<span><span><span class="hljs-variable">$cleaned_html</span></span><span> = </span><span><span class="hljs-title function_ invoke__">strip_tags</span></span><span>(</span><span><span class="hljs-variable">$html</span></span>, </span><span><span class="hljs-string">'<b><a>'</span></span>);
</span></span>The output will be:
<span><span>This </span><span><span class="hljs-keyword">is</span></span><span> a bold paragraph </span><span><span class="hljs-keyword">with</span></span><span> an anchor link.
</span></span>In some complex HTML, especially those containing SVG (Scalable Vector Graphics), strip_tags will remove the SVG tags by default. Suppose we have the following HTML containing an SVG graphic and some text content:
<span><span><span class="hljs-variable">$html</span></span><span> = </span><span><span class="hljs-string">"<div>Some content before SVG</div><svg><circle cx='50' cy='50' r='40' stroke='green' stroke-width='4' fill='yellow' /></svg><div>Some content after SVG</div>"</span></span>;
</span></span>If we use strip_tags, it will remove the entire SVG tag, which might cause us to lose useful content. For example:
<span><span><span class="hljs-variable">$cleaned_html</span></span><span> = </span><span><span class="hljs-title function_ invoke__">strip_tags</span></span><span>(</span><span><span class="hljs-variable">$html</span></span>);
</span></span>Output:
<span><span><span class="hljs-keyword">Some</span></span> content <span><span class="hljs-keyword">before</span></span> SVGSome content <span><span class="hljs-keyword">after</span></span> SVG
</span></span>At this point, we can use the second parameter of strip_tags to specify which tags to keep; however, SVG tags are not standard HTML tags. Without additional handling, strip_tags will still remove the entire SVG element.
To remove only the SVG tags but keep their content, a two-step approach can be used:
Use strip_tags to remove all tags except SVG.
Use regular expressions or other methods to process the SVG content, keeping the inner text or other structure.
<span><span><span class="hljs-variable">$html</span></span><span> = </span><span><span class="hljs-string">"<div>Some content before SVG</div><svg><circle cx='50' cy='50' r='40' stroke='green' stroke-width='4' fill='yellow' /></svg><div>Some content after SVG</div>"</span></span>;
<p></span>// Step 1: Remove all HTML tags<br>
</span>$cleaned_html = strip_tags($html);</p>
<p></span>// Step 2: Keep text or other needed info inside SVG<br>
</span>$cleaned_html = preg_replace('/<svg.<em>?>(.</em>?)</svg>/is', '', $cleaned_html);</p>
<p></span>// Output the cleaned result<br>
</span>echo $cleaned_html;<br>
</span>The output will be:
<span><span><span class="hljs-keyword">Some</span></span> content <span><span class="hljs-keyword">before</span></span> SVGSome content <span><span class="hljs-keyword">after</span></span> SVG
</span></span>strip_tags is a very useful function for cleaning unnecessary tags from HTML. However, when dealing with HTML content that includes SVG graphics, extra caution is required, especially if you want to preserve some content inside the SVG. By combining regular expressions, you can remove the SVG tags while keeping the inner text or other structures, ensuring the content remains clean without losing important information.
