In JavaScript, can I get hold of the node that script is enclosed in?
Question
Is there any way in JavaScript to get hold of the parent node of the currently executing script node without have an id attribute on the script tag?
To illustrate what I mean, if I want to append an img to the document, and I want to append that image to the div node with id "div1_id", can I do that without knowing the id of the div, or having to add the id="_scriptid" attribute to the script tag, as I have had to do below?
<script type="text/javascript">
function fn1()
{
var my_img = document.createElement("img");
var t = document.getElementById("_scriptid");
if (t.parentNode) {
t.parentNode.appendChild(my_img);
} else {
document.getElementsByTagName("body")[0].appendChild(my_img);
}
}
</script>
<div id="_div1_id" name="_div1_name">
<script type="text/javascript" id="_scriptid">
fn1();
</script>
</div>
Here's what I want to do:
<head>
<script type="text/javascript">
function fn1()
{
var my_img = document.createElement("img");
var x = get the node that is the parent node of the current script tag,
and so that I can still separate this code out into a function
as shown here, I do not want the <head> tag returned, I want to
get the parent node of the script that called this function, i.e.
the node commented as "div1" below.
x.appendChild(my_img);
}
</script>
</head>
<div> <!-- div1 -->
<script type="text/javascript">
// Call a function to add an image to the enclosing node (div node in this example):
fn1();
</script>
</div>
The reason I ask is that I am getting someone telling me they are getting an error in IE8 "HTML Parsing Error: Unable to modify the parent container element before the child element is closed (KB927917)" and I suspect it may be because I am using appendChild to append an image to the body element and the body element is not closed. The KB article suggests that adding to the direct parent (even though that tag is obviously not closed) resolves the problem.
Thanks.
2 answers
solution1
0 2011-01-05 14:33:48
尝试将代码分配给一个函数，然后将其分配给window.onload变量
solution2
0 2011-01-05 14:40:28
I think the solution to your problem might be in rethinking the problem.
First of all, you say you got problems with IE8. My advice: Use a Javascript library like jQuery that handles all those browser-specific gotchas for you.
Then, you have some divs with scripts inside and you don't want to give the divs or scripts unique ids. Nonetheless, you do have to put seomthing in your div to call the function. My advice: use classes instead.
<div class="callFn1"></div>
How is this useful? In combination with jQuery, this gives you the following solution to your problem:
$(".callFn1").each(
function() {
fn1(this);
});
With $(".callFn1") you select all elements that contain the class "callFn1", .each iterates on all the selected elements and calls a function. This function calls fn1 with parameter this - which gives you the current element that's processed. All you'd have to do now, would to modify your function fn1 a little bit like this:
function fn1(x)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.