Strange behavior when passing jquery an html string containing a script tag

Strange behavior when passing jquery an html string containing a script tag

 Hello,

The easiest way to explain this is probably just an example.

  1.  var content = $('<div><script type="application/json">{ "some":"json" }</script></div>');
  2. alert(content.length); // 2
The issue is that any script tag contained in the html string, no matter how deeply nested, is pulled out of it's containing element & appended to the jquery object. 


This is causing a problem for me because the html string I'm passing is the response to an ajax request, and the script contains json data relevant to the script's parent element. I am using the metadata plugin to extract it, similar to this example on the metadata plugin's page:

  1. <li class="someclass"><script type="application/json">{some:"json",data:true}</script>...</li>
  2. <script>alert($('li.someclass').metadata({type:'elem',name:'script'}).some);</script> 


Questions: Is this behavior correct/desired? If so, why is it useful? Is there any way to prevent it from happening?

Thanks in advance.


    • Topic Participants

    • bryan