需要更改此 JQuery 代码以在处理之前检查元素是不是存在 [重复]

Posted 2023-02-21

【中文标题】需要更改此 JQuery 代码以在处理之前检查元素是不是存在 [重复]

【英文标题】：Need to change this JQuery code to check for element existence prior to processing [duplicate]需要更改此 JQuery 代码以在处理之前检查元素是否存在 [重复]

【发布时间】：2014-06-24 18:43:56

【问题描述】：

我有以下代码：

            <script type="text/javascript">
            $(function () 
                $('#js-news').ticker(
                    speed: 0.10,
                    htmlFeed: false,
                    fadeInSpeed: 600,
                    titleText: 'DASHBOARD ALERTS',
                    direction: 'ltr',
                    displayType: 'reveal',
                    controls: false
                );
            );
        </script>

我想对其进行更改，使其仅在#js-news 存在时触发。在较旧的 IE V10 浏览器中，我收到错误消息：“DOM 中不存在元素”，并且相关页面没有 js-news 元素。较新的浏览器似乎可以应付，但不是 IE7、8、9。

对代码更改的想法表示赞赏。

谢谢。

【问题讨论】：

ticker 怎么写 id 对不存在的元素有效？ O_O

假设小部件被正确写入。

这看起来像 jQuery News Ticker，如果你打开那个 js 文件并查看第 22 行，它会检查它是否已经传递了元素。否则它将在控制台中记录一条消息，说明“元素在 DOM 中不存在！” （或在控制台不可用时发出警报）。

jQuery.fn 上的方法通常会在内部调用.each，以便它们可以处理任何给定大小的选择。看来这个插件写得不好。

见how todebug JavaScript。

【参考方案1】：

首先，正如上面 cmets 中@Archer 所指出的，这个插件没有正确编码。当在没有元素的 jQuery 对象上调用其方法时，惯用的 jQuery 插件将静默失败。

从这里的代码可以看出，这个插件要么运行console.log()，要么运行alert()，如果没有元素时console不存在：

if ($(this).length == 0) 
    if (window.console && window.console.log) 
        window.console.log('Element does not exist in DOM!');
     else 
        alert('Element does not exist in DOM!');    
    
    return false;

这很糟糕。该插件确实有一个可以禁用的debugMode，但它无济于事，因为这里没有使用该标志。要修改源代码，您可以更改上面的第一行：

if (opts.debugMode && $(this).length == 0) 

然后一定要在你的设置中设置debugMode:false。

--

但这最终对 IE 的影响是它没有在开发工具关闭时定义 console 对象（在 IE6/7 中从来没有），所以一个简单的解决方案是以确保该对象是使用 NO-OP 函数定义的。

if (!window.console) 
    window.console = 
        log: function() 
    ;

现在它将找到console 并在IE 中调用空函数，而不是触发alert()。

console 对象上还有其他方法可能也应该填写，但log() 是最常见的。

---

如果您愿意，向开发人员提交错误报告可能不是一个坏主意。项目好像最近2年没更新了，不知道有没有用，不过没关系。

【讨论】：

多么令人惊叹的答案。最有帮助。谢谢。

【参考方案2】：

添加检查长度的条件：

if($('#js-news').length)
  $('#js-news').ticker(
                speed: 0.10,
                htmlFeed: false,
                fadeInSpeed: 600,
                titleText: 'DASHBOARD ALERTS',
                direction: 'ltr',
                displayType: 'reveal',
                controls: false
  );

【讨论】：

对我来说没有意义。如果this 对象没有选择任何元素，正确编写的 jQuery 插件将不会做任何事情。

看起来插件没有正确处理该部分。