Side navigation
#8289 closed bug (invalid)
Opened February 16, 2011 06:35AM UTC
Closed February 17, 2011 06:10PM UTC
Last modified March 14, 2012 08:31PM UTC
appended <script> tag not found by jquery after successful append
Reported by: | randynwalsh@gmail.com | Owned by: | randynwalsh@gmail.com |
---|---|---|---|
Priority: | low | Milestone: | 1.next |
Component: | manipulation | Version: | 1.4.4 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
If I have the following statement, which adds a function at runtime:
$('<script id="abc">function abc() {}</script>').appendTo('head');
it correctly inserts into the DOM, (Can be called), - but isn't found again by JQuery, as in:
$('#abc').html() -> returns null
Is there a way to get JQuery to recognize the new function that was added dynamically?
Thank you in advance
Attachments (0)
Change History (3)
Changed February 17, 2011 02:29PM UTC by comment:1
component: | unfiled → manipulation |
---|---|
owner: | → randynwalsh@gmail.com |
priority: | undecided → low |
status: | new → pending |
Changed February 17, 2011 04:18PM UTC by comment:2
status: | pending → new |
---|
Replying to [comment:1 jitter]:
Thanks jitter,
The info you sent me was good to know but didn't address the issue I was having. As you know, you can add ID attributes to TAGs and then use jQuery selectors to retrieve the tag elements. This is true of SCRIPT tags as well, when they are loaded statically. However, when you create SCRIPT tags dynamically, the jQuery selectors don't find them. I modified your test case to show you.
Thanks again,
Randy
Thanks for taking the time to contribute to the jQuery project by writing a bug report. This isn't a bug but works like this by design (and it's a fairly well known behavior of jQuery too). I'm not sure what you are trying to say with "get JQuery to recognize the new function". Check this test case, the code in the script tag is evaluated and after that the function is callable. ----- Instead of coming up with an explanation my self I quote karl swedberg: > All of jQuery's insertion methods use a domManip function internally to clean/process elements before and after they are inserted into the DOM. One of the things the domManip function does is pull out any script elements about to be inserted and run them through an "evalScript routine" rather than inject them with the rest of the DOM fragment. It inserts the scripts separately, evaluates them, and then removes them from the DOM. > >I believe that one of the reasons jQuery does this is to avoid "Permission Denied" errors that can occur in Internet Explorer when inserting scripts under certain circumstances. It also avoids repeatedly inserting/evaluating the same script (which could potentially cause problems) if it is within a containing element that you are inserting and then moving around the DOM. To round this up you can check the following related tickets for more info: #1698, #3105, #6558, #8298
Changed February 17, 2011 06:10PM UTC by comment:3
resolution: | → invalid |
---|---|
status: | new → closed |
As per jitter’s comment, this is by design. JavaScript is evaluated and not appended to the document when using the DOM manipulation functions. There is no purpose to adding an ID to a <script> tag since no matter what you do to it, the evaluated code will not go anywhere when the tag is changed.
Thanks for taking the time to contribute to the jQuery project by writing a bug report.
This isn't a bug but works like this by design (and it's a fairly well known behavior of jQuery too).
I'm not sure what you are trying to say with "get JQuery to recognize the new function". Check this test case, the code in the script tag is evaluated and after that the function is callable.
Instead of coming up with an explanation my self I quote karl swedberg:
>
>I believe that one of the reasons jQuery does this is to avoid "Permission Denied" errors that can occur in Internet Explorer when inserting scripts under certain circumstances. It also avoids repeatedly inserting/evaluating the same script (which could potentially cause problems) if it is within a containing element that you are inserting and then moving around the DOM.
To round this up you can check the following related tickets for more info:
#1698, #3105, #6558, #8298