仅在 IE9+ 中调用 jquery document.ready 和 window.load 后 getElementById 不在 DOM 中答案

【问题标题】：getElementById not in DOM after calling jquery document.ready and window.load only in IE9+仅在 IE9+ 中调用 jquery document.ready 和 window.load 后 getElementById 不在 DOM 中
【发布时间】：2012-09-13 18:52:40
【问题描述】：

当我运行我的页面时，有时 getElementById 调用会找到元素，有时却找不到。绝对是时间问题。这仅在 IE9 中发生，而不在 IE 兼容模式（7 或 8）中发生，也不会在任何其他浏览器（Firefox、Opera、Safari 和 Chrome）中发生。无法创建小提琴，因为当我将页面剥离以适合小提琴并将其沙箱化时，问题就消失了。我的 getElementById javascript 调用位于 head 部分，据我所知，除非您在 DOM 准备就绪或窗口加载的情况下等待它们，否则此时将无法找到元素。我尝试将我的 getElementById javascript 包装在 jquery 的 $(document).ready 函数中，但这没有任何效果。我还尝试将它包装在我认为必须工作的 jquery 的 $(window).load 函数中，但这也没有效果。

如果我尝试使用此 window.onload 解决方案 (addLoadEvent) 等待元素，则它可以工作并找到它。那么为什么不使用 jquery 的 document.ready 或 window.load API？

我确实尝试在它引用的标记的 html 之后将脚本向下移动到页面中，但这没有任何效果，因为问题仍然存在并且它找不到元素。我也把它移到了最后，但也没有效果。我对这个特定的结果感到困惑，因为我认为将 javascript 移到末尾会使这些元素可用（或者我读过），但似乎情况并非如此。有谁知道这是为什么？

我之前确实提到它只发生在 IE9 中。此外，只有在初始页面加载时才会出现问题，并且任何页面刷新都会使问题消失。我猜可能是因为缓存。

我使用的是 asp.net 4.0，这并不重要（或者我认为）。 javascript 位于 html 部分上方的 .aspx 页面中，而不是外部 js 文件中。我确实尝试将它移动到一个外部文件只是为了彻底，但这并没有像预期的那样产生任何效果。

总之，

为什么 jquery API 不工作？和
为什么将 javascript 移到页面下方（或移到末尾）也不起作用？

内部 Javascript 代码片段：

//        addLoadEvent(setupstuff);

//        function addLoadEvent(func)
//        {
//            var oldonload = window.onload;

//            if (typeof window.onload != 'function')
//            {
//                window.onload = func;
//            }
//            else
//            {
//                window.onload = function ()
//                {
//                    if (oldonload)
//                    {
//                        oldonload();
//                    }
//                    func();
//                };
//            }
//        }

    var txtLocation = '<%=txtLocation.ClientID%>';

    // JQuery plugin - JQueryLive (waits for element)
    $('#' + txtLocation).livequery(function ()
    {
        setupstuff();
    });


    //$(document).ready(function () //didn't work
    //$(window).load(function() //didn't work
    function setupstuff()
    {
        // search text watermark toggling
        var hasWatermark = $('#' + txtLocation).hasClass('txtLocationWatermark');

        var searchText;
        if (document.getElementById(txtLocation))
        {
            searchText = document.getElementById(txtLocation).value;
        }
        else
        {
            alert('Element ' + txtLocation + ' not found in DOM!');
            return;
        }
        //var searchText = $('#' + txtLocation).val(); //doesn't work either

【问题讨论】：

我在 PowerShell 中遇到了类似的问题。你试过兼容模式吗？ stackoverflow.com/a/6067870/945456

标签： dom internet-explorer-9 onload getelementbyid document-ready

【解决方案1】：

升级到最新版本的 jQuery 解决了这个问题，因为在以前的版本之一（jQuery 1.7.?）中存在一个带有 .ready() 函数的错误，该函数记录在发行说明中。

【讨论】：