puting script tag dynamically in head crashes IE

**jigarshah** · 01-19-2007, 02:49 PM

I am trying to add "<script>" tag in head section through javascript.
trial page

http://jigarashah.50webs.com/googleHead.html

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>My Google AJAX Search API Application</title>
    <link href="http://www.google.com/uds/css/gsearch.css" type="text/css" rel="stylesheet"/>
    <script src="googleHead.js" type="text/javascript"></script>
    <script language="Javascript" type="text/javascript">

    //<![CDATA[

    function OnLoad() {
      // Create a search control
      var searchControl = new GSearchControl();

      // Add in a full set of searchers
      var localSearch = new GlocalSearch();
      searchControl.addSearcher(localSearch);
      searchControl.addSearcher(new GwebSearch());
      searchControl.addSearcher(new GvideoSearch());
      searchControl.addSearcher(new GblogSearch());

      // Set the Local Search center point
      localSearch.setCenterPoint("New York, NY");

      // Tell the searcher to draw itself and tell it where to attach
      searchControl.draw(document.getElementById("searchcontrol"));

      // Execute an inital search
      searchControl.execute("Google");
    }

    //]]>
    </script>
  </head>

  <body onload="OnLoad()">
    <div id="searchcontrol"/>
  </body>
</html>

http://jigarashah.50webs.com/googleHead.js

Code:

putGoogleSearchscript();

function putGoogleSearchscript() {
  var key = 'ABQIAAAAnm6m31gbt_LgIZtU-_qGiBSzw8s6-P8gHRdt7bjmGcPTAmzhSxRDPCRBG0pWo48_Qjk-Pbrc-fNfeA';
  var scriptTag=document.createElement('script');
  scriptTag.type = 'text/javascript';
  scriptTag.src='http://www.google.com/uds/api?file=uds.js&amp;v=0.1&amp;key=' + key ;
  var element = document.getElementsByTagName("head")[0];

/* this statement causes IE crash */
  element.appendChild(scriptTag);
}

**jscheuer1** · 01-20-2007, 09:01 AM

There are two things that jump out at me. You really shouldn't be calling your onload function 'OnLoad()'. I know that it should be case sensitive but, in IE (and sometimes other browsers) this is can be lost track of. Use a totally non-reserved name like:

myOnload()

OK, now the next thing that bothers me is the named entities in the src attribute assignment, I would use:

Code:

scriptTag.src='http://www.google.com/uds/api?file=uds.js&v=0.1&key=' + key ;

Since HTML is not involved in any way, named entities would most likely just become a literal part of the string. If so, it would be invalid at best.

Try it with those two modifications and see - I am assuming that this is working in other browsers 'as is', is it?

Oh, and if the server serves this page as XHTML/xml, IE cannot parse it. Switch to HTML 4.01 strict with a plain opening <html> tag.

**jigarshah** · 01-21-2007, 07:23 PM

i think i solved it by removing named entities. But i am not sure whether it works. I tried on local machine it works but on web again it fails. I don't know whether its problem with IE caching. It still hangs IE.

Really IE sucks...Making pages compatible with is really a headache. It works fine with almost all other browsers. (SAfari, Firefox, Flock, Opera Konquerer ....all of them) Anyways thanks for help.

**jscheuer1** · 01-22-2007, 04:37 AM

Another thing you could try is escaping the ampersand:

Code:

scriptTag.src='http://www.google.com/uds/api?file=uds.js\&v=0.1\&key=' + key ;

or even:

Code:

scriptTag.src='http%3A%2F%2Fwww.google.com%2Fuds%2Fapi%3Ffile%3Duds.js%26v%3D0.1%26key%3D' + key ;

Also make sure to try my other previous suggestions.

**jigarshah** · 01-22-2007, 04:43 AM

another strange thing i noticed was if i put an alert statement printing srciptTag

alert(scriptTag)

then it works

What exactly tht means ? I will try with your suggestions

**jigarshah** · 01-22-2007, 06:05 AM

look at these two. Only difference is i have an alert box before appending child node. First one does not work. It fails to put script tag in code.

Code:

putGoogleSearchscript();

function putGoogleSearchscript() {
  var key = 'ABQIAAAAnm6m31gbt_LgIZtU-_qGiBSzw8s6-P8gHRdt7bjmGcPTAmzhSxRDPCRBG0pWo48_Qjk-Pbrc-fNfeA'; //jigarashah.50webs.com
  var scriptTag=document.createElement('script');
  scriptTag.type = 'text/javascript';
  scriptTag.src='http://www.google.com/uds/api?file=uds.js&v=0.1&key=' + key ;
  var myElement = document.getElementsByTagName("head")[0];
  //alert(myElement);
/* this statement causes IE crash */
  myElement.appendChild(scriptTag);
}

http://jigarashah.50webs.com/googleHead.html

Second one does work

Code:

putGoogleSearchscript();

function putGoogleSearchscript() {
  var key = 'ABQIAAAAnm6m31gbt_LgIZtU-_qGiBSzw8s6-P8gHRdt7bjmGcPTAmzhSxRDPCRBG0pWo48_Qjk-Pbrc-fNfeA'; //jigarashah.50webs.com
  var scriptTag=document.createElement('script');
  scriptTag.type = 'text/javascript';
  scriptTag.src='http://www.google.com/uds/api?file=uds.js&v=0.1&key=' + key ;
  var myElement = document.getElementsByTagName("head")[0];
  alert(myElement);
/* this statement causes IE crash */
  myElement.appendChild(scriptTag);
}

http://jigarashah.50webs.com/googleHead2.html

Its really strange.

**jscheuer1** · 01-22-2007, 06:06 AM

That probably means that IE just needs time to find and load something(s). A properly placed time out might take care of it.

**Twey** · 01-22-2007, 06:09 AM

Yes, I've encountered this before. Don't think we managed to find a workaround, though.

**jigarshah** · 01-22-2007, 06:16 AM

@jscheuer1

okay that makes sense. but how do i put timeout ? and why it hangs IE for that matter ? This sample code does not; but actual implementation which same as this(js method is exactly same). does hang IE. for reference
http://jigarashah.50webs.com/

CAUTION :: IT WILL HANG IE

**jscheuer1** · 01-22-2007, 06:46 AM

In IE 7 this is where the error seems to come from:

Code:

    function myOnLoad() {
      // Create a search control
      var searchControl = new GSearchControl();

      // Add in a full set of searchers
      var localSearch = new GlocalSearch();
      searchControl.addSearcher(localSearch);
      searchControl.addSearcher(new GwebSearch());
      searchControl.addSearcher(new GvideoSearch());
      searchControl.addSearcher(new GblogSearch());

      // Set the Local Search center point
      localSearch.setCenterPoint("New York, NY");

      // Tell the searcher to draw itself and tell it where to attach
      searchControl.draw(document.getElementById("searchcontrol"));

      // Execute an inital search
      searchControl.execute("Google");
    }

So, I would suggest this:

Code:

    function myOnLoad() {
if(typeof GSearchControl=='undefined'){
setTimeout("myOnLoad()", 300);
return;
}
      // Create a search control
      var searchControl = new GSearchControl();

      // Add in a full set of searchers
      var localSearch = new GlocalSearch();
      searchControl.addSearcher(localSearch);
      searchControl.addSearcher(new GwebSearch());
      searchControl.addSearcher(new GvideoSearch());
      searchControl.addSearcher(new GblogSearch());

      // Set the Local Search center point
      localSearch.setCenterPoint("New York, NY");

      // Tell the searcher to draw itself and tell it where to attach
      searchControl.draw(document.getElementById("searchcontrol"));

      // Execute an inital search
      searchControl.execute("Google");
    }

Thread: puting script tag dynamically in head crashes IE

Thread Tools

Search Thread

puting script tag dynamically in head crashes IE

Bookmarks

Bookmarks

Posting Permissions