943,917 Members | Top Members by Rank

Ad:
Aug 8th, 2009
0

Detect div change

Expand Post »
Hi people,

How to I can detect if a div was changed after the page loaded?

E.g. by innerHTML function.

ps: onChange not is valid for tag div. Reference here on w3c.

Thanks!
Similar Threads
Reputation Points: 10
Solved Threads: 0
Newbie Poster
zegames is offline Offline
7 posts
since Nov 2006
Aug 8th, 2009
0

Re: Detect div change

My immediate thought is that you could md5(innerHTML onload) your div's and store the reult (as a JavaScript variable). Then, whenever you need to know if the div's contents have changed, compare md5(current innerHTML) with the stored md5.

Md5 would be a cheap way to store a representation of innerHTML without needing to store inneHTML itself. Even cheaper would be innerHTML.length but a subsequent comparison would be significantly less reliable unless you can make length assumptions about your div's contents.

Of course, with these techniques no event will fire as it would if onchange were available so you would need to code it somehow differently.

If you don't know what md5 is, then try an internet search (Google, Alta Vista etc).

Airshow
Sponsor
Reputation Points: 318
Solved Threads: 358
WiFi Lounge Lizard
Airshow is offline Offline
2,526 posts
since Apr 2009
Aug 8th, 2009
0

Re: Detect div change

Airshow, the problem still...

window.onload = function () { someVar = document.getElementById('myDiv').innerHTML.length; }; //or md5 like you suggested.
Right, done.

Now I need to compare length after the div content change?

How to?
Last edited by peter_budo; Aug 9th, 2009 at 8:13 am. Reason: Keep It Organized - For easy readability, always wrap programming code within posts in [code] (code blocks) and [icode] (inline code) tags.
Reputation Points: 10
Solved Threads: 0
Newbie Poster
zegames is offline Offline
7 posts
since Nov 2006
Aug 9th, 2009
0

Re: Detect div change

Zeg,
Click to Expand / Collapse  Quote originally posted by zegames ...
Now I need to compare length after the div content change?
That is indeed your problem.

Because onchange is not available, you have no alternative than to perform the comparison :
  • in response to some other event (eg. user event(s) or by setInterval polling).
  • synchronously, in each piece of code that can change the contents of your div.
Airshow
Last edited by Airshow; Aug 9th, 2009 at 8:30 am.
Sponsor
Reputation Points: 318
Solved Threads: 358
WiFi Lounge Lizard
Airshow is offline Offline
2,526 posts
since Apr 2009
Aug 9th, 2009
0

Re: Detect div change

Click to Expand / Collapse  Quote originally posted by zegames ...
Hi people,

How to I can detect if a div was changed after the page loaded?

E.g. by innerHTML function.

ps: onChange not is valid for tag div. Reference here on w3c.

Thanks!
If you have control of the entire page, then the content of a div should change only under program control, under your control. Thus when your program changes the content, it should then call the respective 'onchange' function.

If your program is less deterministic, you'll have to use a background function that periodically checks all your divs of interest. If you are clever, you may be able to add an md5() method to each div; this method returns the md5sum of the innerHTML content; you should also add the original_md5sum value to each div. (Remember, this is ECMAScript: highly flexible. The DOM isn't necessarily etched in stone.)

So, onload:
  • add static original_md5sum to each div of interest of the respective innerHTML content
  • start a function in the background that periodically checks all the divs of interest for change. It either computes the div's innerHTML md5sum compares that with the static original sum.

For background functions, look into interval timers.
Last edited by Fest3er; Aug 9th, 2009 at 3:17 pm.
Reputation Points: 51
Solved Threads: 35
Posting Whiz in Training
Fest3er is offline Offline
238 posts
since Aug 2007

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: JavaScript Custom Object Scope: Why does it work?
Next Thread in JavaScript / DHTML / AJAX Forum Timeline: Javascript Scroll Text





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC