Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    Regular Coder
    Join Date
    Feb 2003
    Posts
    638
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Internet Explorer Document Mutation

    Is there is some method for detecting whether any changes have occured within a document's innerHTML?

    The only mention of this I've seen referred to "DOMSubtreeModified", but with no explanation of how to use it.

    My purpose is to display a confirm message (for overwriting the document) if any styles, values, or content have been modified (or just close the document without a message, if nothing has changed).

    Here is a crude/limited example of what I'm trying to accomplish:

    Code:
    <HTML XMLNS:HTA><HEAD><TITLE>docOverwite</TITLE><HTA:APPLICATION></HTA:APPLICATION>
    <SCRIPT type=text/JScript>
    window.onbeforeunload=function determine(){
    if (Box.checked==true){return ask()}}
    function ask(){
    Box.checked=false;if (confirm("Overwrite this document?")){
    return save()}else opener=self;opener.close()}
    function save(){
    var thisLocation=document.URL.replace(/^(file:\/\/)/,"").replace(/(\\)/g,"\\\\").replace(/(%20)/g," ");
    var forWriting=2;
    var dataFile=thisLocation;
    var fso=new ActiveXObject("Scripting.FileSystemObject");
    ts=fso.OpenTextFile(dataFile,forWriting,true);
    ts.Write(document.documentElement.outerHTML);
    ts.Close();
    }
    </SCRIPT>
    </HEAD>
    <BODY bgColor=buttonface>
    <TEXTAREA style="WIDTH: 100%; HEIGHT: 200px" onpropertychange=Box.checked=true></TEXTAREA>
    <INPUT id=Box disabled type=checkbox></BODY></HTML>

  • #2
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    document.addEventListener("DOMSubtreeModified", function(event) {
    alert("Document modified!");
    }, false);

    If it works anywhere, it would be in Mozilla. No other browser supports mutation events at all.

  • #3
    Regular Coder
    Join Date
    Feb 2003
    Posts
    638
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Alright, thank you for the info.

    Would there happen to be other ways of detecting innerHTML changes--without using specific event handlers?

  • #4
    Regular Coder
    Join Date
    Jun 2002
    Posts
    623
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Reading innerHTML in IE is a not acurate so I don't think anything like that would work. This is just an idea.

    Save the page unonload regardless of changes as a temp file then

    Code:
    var fs = fso.OpenTextFile(temp_file)
    var str1 = fs.ReadAll()
    
    fs = fso.OpenTextFile(original_file)
    var str2 = fs.ReadAll()
    
    if (str1 != str2) {
    save()
    }
    var remove_file = fso.GetFile(temp_file)
    remove_file.Delete()
    If you save the file, write str1 over the original file. I just typed this here so check it first. Especially with delete in there

    <edit>
    See what I mean by checking it, I mis-spelled "typed"
    </edit>
    Last edited by Graeme Hackston; 07-03-2003 at 05:22 AM.

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Posts
    623
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Also, a tip while you're checking, write the page strings to files and check them there. Alerting whole pages is no fun.

  • #6
    Regular Coder
    Join Date
    Jun 2002
    Posts
    623
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Just thinking, I've never tried writing a page using outerHTML. I write them like this:

    function Write_Page() {
    page = '<html>\n'
    page += '...'
    if (some_change) {
    page += change +'\n'
    }
    page += '...'
    page += '</html>'
    ts.Write(page);
    ts.Close();
    }

    That type of thing. I've noticed that innerHTML is parsed. Does this work for you using outerHTML?
    Last edited by Graeme Hackston; 07-03-2003 at 06:11 AM.

  • #7
    Regular Coder
    Join Date
    Feb 2003
    Posts
    638
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Save the page unonload regardless of changes as a temp file then...


    What a great idea! Thanks a lot for suggesting it...

    I managed to get that working & then thought to try the same sort of thing with a Modeless Dialog, which also does the trick:

    Code:
    <HTML XMLNS:HTA><HEAD><TITLE>Detect Edit & Overwrite HTA</TITLE>
    <SCRIPT type=text/JScript>
    var smd = showModelessDialog("javascript&#58;var dSource='<html><textarea id=stored></textarea></html>';document.write(dSource)","","dialogWidth:0px;dialogHeight:0px"); 
    window.onload=function OnloadValue(){ 
    smd.stored.value=document.documentElement.outerHTML;
    window.focus()
    } 
    window.onbeforeunload=function UnloadValue(){
    if (document.documentElement.outerHTML != smd.stored.value){return ask()}else alert('nothing changed...')}
    function ask(){if (confirm("Overwrite this document?")){return save()}}
    function save(){
    var thisLocation = document.URL.replace(/^(file:\/\/)/,"").replace(/(\\)/g,"\\\\").replace(/(%20)/g," ");
    var dataFile = thisLocation;
    var forWriting = 2;
    var fso = new ActiveXObject("Scripting.FileSystemObject");
    var ts = fso.OpenTextFile(dataFile,forWriting,true);
    ts.Write(document.documentElement.outerHTML);
    ts.Close()}
    </SCRIPT>
    </HEAD>
    <BODY><TEXTAREA style="WIDTH: 100%; HEIGHT: 200px"></TEXTAREA></BODY></HTML>


    That type of thing. I've noticed that innerHTML is parsed. Does this work for you using outerHTML?


    I don't know off-hand how to put that together, but I'll let you know what happens if I figure it out... thanks again.

  • #8
    Regular Coder
    Join Date
    Feb 2003
    Posts
    638
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Oh, I probably should have written the dialog this way, instead:

    var smd=showModelessDialog("nonExistent.html","","dialogWidth:0px;dialogHeight:0px");
    window.onload = function OnloadValue(){
    var dSource = "<html><textarea id=stored></textarea></html>";
    smd.document.open();
    smd.document.write(dSource);
    smd.document.close();
    smd.stored.value=document.documentElement.outerHTML;
    window.focus()}


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •