How to abort loading of dynamically included <script>

[boczek]

Hello all.

I'm writing a small async webapp. in JavaScript and I'm using <script>
element technique to load data.
I'm usign <script> because of cross domain restrictions with
XmlRequest.

The problem is when I remove a element that is currently loading from
DOM (with removeChild) Firefox still loads it and waits with other
scripts.

What I want is to break this process and load a new data without
waiting for old one.

Here is example script:

<script type="text/javascript">
var COUNTER = 0;
var CURRENT = null;
function loadScript(id) {
//abort previous script
if (CURRENT !== null) {
document.body.innerHTML += 'Abort: '+ id + '<br />';
CURRENT.parentNode.removeChild(CURRENT);
CURRENT = null;
}

//create new script
var element = document.createElement('script');

//load script with new params
element.id = id;
element.src = 'some.php?id='+id;
element.type = 'text/javascript';
element.charset = 'utf-8';

CURRENT = element;
document.body.innerHTML += 'Loading: '+ id +'<br />';
document.getElementsByTagName('head')[0].appendChild(element);
}

function makeSomeNoise() {
COUNTER++;

loadScript('script_'+COUNTER+'_'+(Math.random()*Math.random()).toString().substr(2));
if (COUNTER < 10) {
setTimeout(makeSomeNoise, 200);
}
}

makeSomeNoise();
</script>


And some.php code:


<?php
sleep(3);
echo 'document.body.innerHTML += "Loaded: '. $_GET['id'] .'<br />";';
?>

Anyone can help?

 

[Martin Honnen]

I'm writing a small async webapp. in JavaScript and I'm using <script>
element technique to load data.
I'm usign <script> because of cross domain restrictions with
XmlRequest.

The problem is when I remove a element that is currently loading from
DOM (with removeChild) Firefox still loads it and waits with other
scripts.

I am not sure there is anything you can do about that. I don't think any
browser unloads script code when the HTML script element is removed from
the document. And I don't think you can force the browser to abort
loading of a resource when you remove an element referencing the
resource. With the "new demands" dynamic web applications have it might
be that a bug report on https://bugzilla.mozilla.org/ or probably better
first a request in mozilla.dev.tech.dom changes the behaviour in future
Mozilla versions.

Have you tested with other browsers? Which browsers abort the script
loading when you remove the script element from the document?

 

[boczek]

Martin Honnen napisal(a):

boczek wrote: [...]

The problem is when I remove a element that is currently loading from
DOM (with removeChild) Firefox still loads it and waits with other
scripts.

[...]
Have you tested with other browsers? Which browsers abort the script
loading when you remove the script element from the document?

IE7 seems to load everything but not executing removed scripts.
Opera loads and executes all scripts.

Yes. It seems that it is not specified what to do when user removes
"script" element of currently loading code. I'll try to find other
solution.. maybe with splitting one connection into chunks and when new
connection is established I can stop sending remaining chunks.

Thx. for your post.