Is there a way to get the DOM element that contained the inline JS script that called a function?

Question

For example

<script>
function foo(){...}
</script>

<div><script>foo();</script></div>
<span><script>foo();</script></span>

and I wanted to have foo return "abc" when called from a div, return "123" when called from a span.

Is this possible?

Answer 1

No, this is not possible. You would have to manually pass some kind of parameter to identify where it was called from.

Answer 2

There isn't a way to do this, script can be called in many different ways, there just isn't enough need for this to put it in the spec in any way.

I would imagine there's a much simpler way overall to do what you're trying to accomplish, embedding <script> inside individual elements and basing anything off the <script> element's location doesn't' seem like a sound approach.

So...what are you trying to ultimately accomplish here?

Answer 3

You can just get the last element currently in the DOM.

The code in an inline <script> block executes as the browser parses the page. Therefore, the last DOM element will be just before the script.

Answer 4

After reading your comment I think you should do something else:

1. create empty elements where your ads should appear (#ad1_empty, #ad2_empty, ...)
2. place your ad code at the bottom of the page hidden (#ad1_full, #ad2_full, ...)
3. when the document is ready, replace all empty elements with the real ones

// code

<div id="ad_empty"><!-- placeholder --></div>
<div id="ad_content" style="display: none;">
    <script src="[ad resource]"></script>
    <script>inline ad script</script>
</div>

<script>
function replace( oldel, newel, show ) {
  if ( typeof newel == "string" ) 
    newel = document.getElementById( newel );
  if ( typeof oldel == "string" ) 
    oldel = document.getElementById( oldel );
  if ( newel && oldel )
    oldel.parentNode.replaceChild( newel, oldel );
  if ( show ) 
    newel.style.display = "";
}

window.onload = function() {
    replace( "ad_empty",  "ad_content",  true );
    replace( "ad_empty2", "ad_content2", true );
};
</script>

---

It is possible to do what you originally wanted, btw (but it's useless)

function foo() {

  var scripts = document.getElementsByTagName("script");
  var parent = scripts[scripts.length-1].parentNode;
  var tag = parent.nodeName.toUpperCase();

  if (tag == "DIV") {
    alert("called from a <div>");
  } else if (tag == "SPAN") {
    alert("called from a <span>");
  }
}