静态脚本标记中的跨浏览器onload事件

时间:2012-01-21 20:28:50

标签: javascript html onload this-keyword

在html文档中是否存在将onload事件与静态脚本标记相关联的跨浏览器方式?

以下内容在IE 7和IE 8中不起作用:

<script onload="DoThat" type="text/javascript" src="..."></script>

一些背景

我找到了一种使用动态脚本标记和if语句来实现此目的的方法。例如,在this MSDN article中解释。

我的问题是我需要找到当前的脚本标记,因为我正在构建可以就地插入DOM元素的小部件。在过去I have found some workarounds to do this,但他们都有自己的缺点。我希望在脚本onload事件中使用“this”关键字会有所帮助。

2 个答案:

答案 0 :(得分:3)

据我了解,您需要使用代码来了解它所属的脚本元素。然后,您可以在此脚本旁边插入必要的HTML小部件内容,或者附加到脚本父级等。如果是,那么我会建议您采用另一种方法。

在您的小部件javascript文件中放置下一行代码:

var scripts = document.getElementsByTagName('script'),
    thisScript = scripts[scripts.length - 1];

thisScript是您要查找的DOM元素,当前脚本元素此代码位于中。这么简单。

为什么会这样。 详细说明http://feather.elektrum.org/book/src.html。只是一个摘要:

  

当在页面中加载带有src的脚本时,页面的其余部分尚未写入。这意味着无论页面包含多少脚本,当前开始执行的脚本都是最后一个

这是一种相当简单有效的技术,但并不是很多人都知道这种可能性。它可靠且100%兼容浏览器。顺便说一句,Google使用此代码呈现+1按钮:

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
  {lang: 'dk'}
</script>

那么如何思考api脚本如何获得这个哈希参数呢?在我的示例中,它将是thisScript.innerHTML

答案 1 :(得分:0)

我不确定我是否抓住了你的需求 无论如何,要找到当前脚本,您可以尝试此示例

<script src="jquery-1.7.1.min.js" varTest="valueTest" id="myID"></script>
<script>

var scripts = document.getElementsByTagName('script');      
var pattern = 'jquery-1.7.1.min.js';
var i = undefined;

for (var x=0; x<scripts.length; x++)
{
    if (scripts[x].src.match(pattern)) { i = x; break; }
}

if (typeof(i) != 'undefined')
{
    // Do any association needed here
    var current_script = scripts[i];
    // Just for test            
    console.log(current_script.attributes);
}

</script>