[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1351
  • Last Modified:

innerHTML Cleanup: Remove specific tags from string

I have an innerHTML:

<p><span id="Samples_Highlight" class="ewHighlightSearch">A</span>.LetterA<span id="Samples_Highlight" class="ewHighlightSearch">A</span></p>

I need a function to get rid of the SPAN tags so the result becomes:

<p>A.LetterAA</p>
0
fcqmax
Asked:
fcqmax
  • 4
  • 2
  • 2
1 Solution
 
erikTsomikSystem Architect, CF programmer Commented:
try this
<html>
  <head>
    <title>Please Wait Message</title>
   <script type="text/javascript">
       function RemoveTags(elt) {
while(elt.firstChild)elt.parentNode.insertBefore(elt.firstChild, elt);
return elt.parentNode.removeChild(elt);
}
      
      
      
       </script>
  </head>

  <body onload="RemoveTags (span);">

<p><span id="Samples_Highlight" class="ewHighlightSearch">A</span>.LetterA<span id="Samples_Highlight" class="ewHighlightSearch">A</span></p>
  </body>
</html>


0
 
erikTsomikSystem Architect, CF programmer Commented:
0
 
EZFragCommented:
Hi there,

A simple regex could solve this. I have added an example below.

Hope it helps ^_^
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript"><!--
function removeel(obj)
{
        var el = document.getElementById(obj);
        var innerhtml = el.innerHTML;
        alert(innerhtml.replace(/<span(.)*?>|<\/span>/g,''));
 
}
//--></script>
</head>
<body>
<div id="testdiv">
<p><span id="Samples_Highlight" class="ewHighlightSearch">A</span>.LetterA<span id="Samples_Highlight" class="ewHighlightSearch">A</span></p>
</div>
<input type="button" onclick="removeel('testdiv');" value="Replace Span"/>
</body>
</html>

Open in new window

0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
fcqmaxAuthor Commented:
Is it possible to delete by span id or class? I over simplified and I think I may have more span tags then this example. I specifically only want  span id = "Samples_Highlight" to be removed. Thanks!
0
 
EZFragCommented:
Oh, no problem, I have updated the regex.

Hope it helps ^_^
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript"><!--
function removeel(obj)
{
        var el = document.getElementById(obj);
        var innerhtml = el.innerHTML;
        alert(innerhtml.replace(/<span\s*id\s*=\s*"Samples_Highlight"(.)*?>|<\/span>/g,''));
 
}
//--></script>
</head>
<body>
<div id="testdiv">
<p><span id="Samples_Highlight" class="ewHighlightSearch">A</span>.LetterA<span id="Samples_Highlight" class="ewHighlightSearch">A</span></p>
</div>
<input type="button" onclick="removeel('testdiv');" value="Replace Span"/>
</body>
</html>

Open in new window

0
 
EZFragCommented:
Oh, no wait, that wont work... let me hammer at it a bit more...
0
 
EZFragCommented:
Sweet, got it now.

Hope it helps ^_^
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript"><!--
function removeel(obj)
{
        var el = document.getElementById(obj);
        var innerhtml = el.innerHTML;
        alert(innerhtml.replace(/<span\s*id\s*=\s*"Samples_Highlight"(.)*?>((.)*?)<\/span>/g,'$2'));
 
}
//--></script>
</head>
<body>
<div id="testdiv">
<p><span id="Samples_Highlight" class="ewHighlightSearch">A</span>.LetterA<span id="Samples_Highlight" class="ewHighlightSearch">A</span><span>This should still be here</span></p>
</div>
<input type="button" onclick="removeel('testdiv');" value="Replace Span"/>
</body>
</html>

Open in new window

0
 
fcqmaxAuthor Commented:
Great job!
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 4
  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now