CODEWITHSUNDEEP
javascripthtmlregex
Muaddib878
Muaddib878

Reputation: 356

Regular expression - replace multiple html tags with one

is there a regular expression or any way to replace the following:

  some content...<span style='color:red'>t</span><span style='color:red'>e</span><span style='color:red'>s</span><span style='color:red'>t</span> some content

with this?

some content... <span style='color:red'>test</span> some content

Upvotes: 0

Views: 381

Answers (2)

Valdi_Bo
Valdi_Bo

Reputation: 31011

There are opinions that regex should not be used to process HTML.

If you agree, you can use the following XSLT transformation.

<?xml version="1.0" encoding="UTF-8" ?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="2.0">
  <xsl:output method="html" doctype-public="XSLT-compat"
    encoding="UTF-8" indent="yes" />
  <xsl:strip-space elements="*"/>

  <xsl:template match="span">
    <xsl:copy>
      <!-- Copy attributes and text from the current span -->
      <xsl:apply-templates select="@*|node()"/>
      <xsl:variable name="nextSpans" select="following-sibling::span"/>
      <!-- Copy text from following spans -->
      <xsl:for-each select="following-sibling::node()">
        <xsl:variable name="ind" select="position()"/>
        <xsl:if test="generate-id()=generate-id($nextSpans[$ind])">
          <xsl:value-of select="."/>
        </xsl:if>
      </xsl:for-each>
    </xsl:copy>
  </xsl:template>

  <!-- Switch off processing of "following" spans -->
  <xsl:template match="span[preceding-sibling::node()[1]/name()='span']"/>

  <xsl:template match="@*|node()">
    <xsl:copy><xsl:apply-templates select="@*|node()"/></xsl:copy>
  </xsl:template>
</xsl:stylesheet>

Upvotes: 0

Benjamin Diaz
Benjamin Diaz

Reputation: 196

If the HTML tags are all the same, you can just use String.replace.

var oldStr = "<span style='color:red'>t</span><span style='color:red'>e</span><span style='color:red'>s</span><span style='color:red'>t</span>";
var newStr = oldStr.replace("</span><span style='color:red'>", "");

Upvotes: 6

Related Questions