文档.getElementById返回元素在firefox,但不是chrome

document.getElementById returning element in firefox but not chrome

本文关键字:chrome firefox getElementById 返回 元素 文档      更新时间:2023-09-26

我试图动态加载一个coverflow类型的对象(认为itunes coverflow但不那么花哨)在一个按钮点击后,网页已经加载。我正在动态地创建一个图像列表,以提供给coverflow的javascript,然后加载它们,并使其看起来很漂亮。问题是,在firefox的代码是工作的,但在chrome和ie(惊喜惊喜)的javascript抛出一个错误,页面是空白的,由于下面的错误抛出。问题出在这段试图通过id

获取dom元素的代码中
if (typeof(this.Container) == 'string') { // no node
    var container = document.getElementById(this.Container);
    if (container) {
        this.Container = container;
    } else {
        throw ('ContentFlow ERROR: No element with id '''+this.Container+''' found!');
        return;
    }
}

几乎在chrome中,当dome元素在页面中绝对可用时,它不会被上面的代码捕获。我甚至在chrome的控制台中输入了document.getElementById("container_name");,它返回了元素,所以我不知道为什么它不会在文件中工作。

任何建议都将是感激的

感谢编辑:

这里是试图填充的页面上的HTML

<div id="contentFlow" class="cool_ui ContentFlow">
    <p id="coverflow_school_name"></p>
    <div class="loadIndicator"><div class="indicator"></div></div>
    <div class="flow" style="height:240px;"></div>
    <div class="scrollbar">
        <div class="slider"></div>
    </div>
</div>

回答:

哇,好吧。我想明白了。问题是在调用这段代码之前动态加载一些资源的方式。资源加载导致页面变为空白,因此使var container = document.getElementById(this.Container);返回null,因此抛出异常。奇怪的是firefox可以处理资源加载,但是chrome不能。

Thanks for the help

为什么不使用jquery?

 $('#container_name')

UPDATE:在第二次读取时,这是元素的名称还是Id ?

如果是name,则使用

$('[name="container_name"]')

使用JQuery,你可以直接输入

if($(this.Container).length){
    //Code goes here
}
else
{
    throw ('ContentFlow ERROR: No element with id '''+this.Container+''' found!');
    return;
}

我尝试了Chrome 12.0.742.112的代码,它似乎工作得很好。这里有一个链接:http://jsfiddle.net/eemYg/。
我认为是另一件事引起的问题,例如this.Container。你应该检查它的值(在Chrome中),看看它的值是否与Firefox中的值不同。