Remove and in Text using RegEx

Question

I am trying to get the text available inside the <a> elements. I have used the innerHTML to retrieve that inner text, but in few <a> elements the inner Text is placed inside the  elements.

While retrieving the text value am getting it as sample text as the output string. Can anyone help me to remove the  in the output string using RegEx so that i can only have sample text in my output string.

<a href="#"><span>Sample Text</span></a>

Note: I am not using any Javascript Libraries in the page.

[HTML tags lea͠ki̧n͘g fr̶ǫm ̡yo͟ur eye͢s̸ ̛l̕ik͏e liquid pain, the song of re̸gular expression parsing will extinguish the voices of mortal man from the final ALL IS LOŚ͖̩͇̗̪̏̈́T ALL IS LOST the omes the ichor permeates all MY FACE MY FACE ᵒh god no NO NOO̼OO NΘ stop the an*̶͑̾̾̅ͫ͏̙̤g͇̫͛͆̾ͫ̑͆l͖͉̗̩̳̟̍ͫͥͨe̠̅s ͎a̧͈͖r̽̾̈́͒͑e not rè̑ͧ̌aͨl̘̝̙̃ͤ͂̾̆ ZA̡͊͠͝LGΌ ISͮ̂҉̯͈͕̹̘̱ TO͇̹̺ͅƝ̴ȳ̳ TH̘Ë͖́̉ ͠P̯͍̭O̚N̐Y̡ H̸̡̪̯ͨ͊̽̅̾̎Ȩ̬̩̾͛ͪ̈́̀́͘ ̶̧̨̱̹̭̯ͧ̾ͬC̷̙̲̝͖ͭ̏ͥͮ͟Oͮ͏̮̪̝͍M̲̖͊̒ͪͩͬ̚̚͜Ȇ̴̟̟͙̞ͩ͌͝S̨̥̫͎̭ͯ̿̔̀ͅ](http://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags) — adeneo, Sep 18 '13 at 07:30
Leaving the obligatory link for [why you shouldn't parse HTML with Regex](http://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags) — CodingIntrigue, Sep 18 '13 at 07:31

score 2 · Answer 1 · answered Sep 18 '13 at 07:36

2

innerText or textContent (depending on the browser) gets the elements text without the span tags :

var elem = document.getElementsByTagName('a')[0],
    text = ('innerText' in elem)? 'innerText' : 'textContent';

var content = elem[text];

FIDDLE

answered Sep 18 '13 at 07:36

adeneo

312,895
29
395
388

Moazzam Khan · Accepted Answer · 2013-09-18T07:53:01.863

0

If you can include jQuery, you can use - $("a").text() without using any regex.

And with pure JavScript -

/* elem you can get in many ways, by id, by tagname or by class etc.
   I am using tagName for your specific case
*/
var elem = document.getElementsByTagName('a')[0],

/* use innerText or textContent, whichever is available in browser */     
var content = elem.innerText || elem.textContent;

edited Sep 18 '13 at 07:53

answered Sep 18 '13 at 07:32

Moazzam Khan

3,130
2
20
35

You might want to point out that the OP needs to include the jQuery library, because the question is only tagged Javascript – CodingIntrigue Sep 18 '13 at 07:32
Actually, the OP specifically says they're **not** using any libraries. – Sep 18 '13 at 07:37
Downvote :(, During I was fixing it. I should have got some time to breath. – Moazzam Khan Sep 18 '13 at 07:39
Will it be having Cross Browser Compatibility issues.. as far as i know textContent will not work in IE8? – codeMad Sep 18 '13 at 07:52
@codeMad `elem.innerText || elem.textContent` is taking care of it. – Moazzam Khan Sep 18 '13 at 07:53
2

Jeezes, you even stole my variable names ! – adeneo Sep 18 '13 at 08:17
@adeneo sorry, I was lazy to type :) +1 for you. – Moazzam Khan Sep 18 '13 at 11:08

score 0 · Answer 3 · answered Sep 18 '13 at 07:35

You can use querySelectorAll to find all <a> tags with  children and take the text as necessary:

var elems = document.querySelectorAll("a > span");
for(var e in elems) {
  var element = elems[e];
  var aTag = element.parentNode;
  if(aTag.innerText) aTag.innerText = element.innerText;
  else aTag.textContent = element.textContent;
}

Here is a jsFiddle to demonstrate the above.

To clarify, document.querySelectorAll is only natively supported on IE8+ (and most other modern browsers) but polyfills are available.

Remove and in Text using RegEx

3 Answers3