In essence I populate a <div> via Ajax and the contents consist of some Javascript together with normal HTML and for both the server does change the content: there is minor change to the JS but more to the HTML - it contains data from a database retrieval. My question is what will happen to the JS when the <div> is re-populated by a later Ajax call (and contains different data, including changes to the JS) ?
I use the JQuery Ajax facilties (post and get) and I understand that this does an eval() on any <script> content and the JS does work as I expect but I can see possible problems and I have tried to find some definitive explanations but without success.
So say that I have in the JS loaded via Ajax, the following:
<script>
var one=1;
var two=2;
var number1=73;
etc.
and then I reload the
<script>
var one=1;
var two=2;
var number1=48;
etc.
It does concern me that I am appearing to define ‘one’, ‘two’ and ‘number1’ twice (and more if the reload happens again) but this does appear to work (i.e. ‘number1’ is 48 after the second load) and so I was wondering whether there in some way another ‘one’ etc. is being created and this is not really what I want. I should add that the JS in the Ajax is there because it only relates to operations on the data within the Ajax-loaded and so it makes that component self-contained and does contain function definitions which are used within that <div> for button onclicks e.g. I could almost certainly split the script and HTML and only load the script once on demand but it is quite neat the way it is now - all in one ‘file’.
I am surprised that I cannot find any specific descriptions of this sort of thing on the web (well after a couple of hours searching…).
I currently use Firefox/Firebug but this, so far, hasn’t gotten me very far into the depths of the DOM script-wise. I can/will do some more specific testing but it would be helpful to know what is supposed to be going on.
thanks
graham
