Compare two HTML code blocks

Question

I'm trying to write a javascript plugin to detect the state of a code block, and if it's not in his normal state, trigger some kind of notification.

I've used document.getElementById("alert"); to retrieve the code:

"Normal" state:

<div id="alert" class="tooltip normal" title="">
    <a href="https://"></a>
</div>

"Special" state:

<div id="alert" class="tooltip special" title="">
    <a href="https://"></a>
</div>

I've thought on keeping the "normal" state on a variable, and compare it to the actual state to see if it's different.

Any suggestions? Thanks!

check this, it has all you need http://stackoverflow.com/questions/9279368/how-to-get-all-css-classes-of-an-element — xShirase, Dec 01 '16 at 13:05
Don't worry about picking up the London language, it's a lot like the English language just with more profanities. — Phil Cooper, Dec 01 '16 at 13:28

score 0 · Answer 1 · answered Dec 01 '16 at 13:24

0

function checkNormal(){
    var node = document.getElementById('alert');
    return node.className.indexOf('normal') > -1 ;
}

answered Dec 01 '16 at 13:24

Srikant Sahu

839
1
6
16

score 0 · Answer 2 · answered Dec 01 '16 at 13:26

If you need to find the elements and check their class names to detect the state, the code below should solve your problem

var elems = document.querySelectorAll("[id=alert]");

for (var i=0;i<elems.length;i++)
{

  var elem = elems[i];
  if (elem.className=='tooltip special')
  {alert('special one');}
  else
  {alert('not special');}
}

jsfiddle: https://jsfiddle.net/yzq6gp7w/4/

score 0 · Accepted Answer · answered Dec 01 '16 at 13:29

function containsClass(element, className) {
  return element.classList.contains(className)
}

var result = containsClass(document.getElementById('alert'), 'special')

or just simply...

var result = document.getElementById('alert').classList.contains('special')

Compare two HTML code blocks

3 Answers3