如何测试选择器在jQuery中是否有效答案

【问题标题】：How to test if selector is valid in jQuery如何测试选择器在jQuery中是否有效
【发布时间】：2012-12-21 03:54:09
【问题描述】：

我正在使用 AnySlider jQuery 插件，它动态读取 URL 中的哈希并通过 jQuery 选择页面上的项目。问题是最终用户可以在到达http://mydomain.com/#!demos/slider 时破坏插件。

有没有办法测试选择器是否有效，而不是让 jQuery 崩溃（内置函数或正则表达式）？请参阅这个尝试执行 $('#!demos/slider') 并崩溃的 jsFiddle 示例：http://jsfiddle.net/PvY2b/

$('#!demos/slider') <= Uncaught Error: Syntax error, unrecognized expression: #!demo/slider

【问题讨论】：

您不能自己捕获错误并向用户显示适当的错误消息吗？
我做了一个 try/catch 但似乎是一个懒惰的黑客。 jQuery 中是否有内置函数或在让它崩溃之前进行测试？也许是正则表达式？
我第一次看到被称为“懒惰黑客”的 try/catch
@TruMan1：为什么这是一个懒惰的黑客？似乎这正是exceptions 的用途。为什么要重新发明轮子？ jQuery 已经在为您测试它，它让您知道存在问题的方式是抛出异常。
你应该在任何一天使用 if 语句而不是 try/catch ......否则这是一个懒惰的黑客攻击。

标签： jquery jquery-selectors anythingslider

【解决方案1】：

ID 和 NAME 标记必须以字母 ([A-Za-z]) 开头，并且可以是后跟任意数量的字母、数字 ([0-9])、连字符 ("-")、下划线（“_”）、冒号（“:”）和句点（“.”）。

发件人：Basic HTML data types

因此，这样的事情可能会起作用：

if (/^[A-Za-z][A-Za-z0-9\-_:\.]*$/.test(selector)) {
    // $('#' + selector)...
}

或者干脆逃避它：

selector = selector.replace(/([;&,\.\+\*\~':"\!\^#$%@\[\]\(\)=>\|])/g, '\\$1');

【讨论】：

【解决方案2】：

将这个块包装到 try-catch 中可能更容易，如下所示：

try { 
  $('#!demo/pages') 
} catch(e) { 
  alert('Your selector is invalid'); 
}

这不是一个懒惰的技巧：在处理一些您无法直接控制的外部组件时，这是一种非常常见的方法。

【讨论】：

【解决方案3】：

在之前的答案中找到：How do I extend jQuery's selector engine to warn me when a selector is not found?

你必须扩展 jQuery init：

var oldInit = $.fn.init; // cache it

$.fn.init = function(selector, context, rootjQuery) {

    var result = new oldInit(selector, context, rootjQuery);

    if (result.length === 0)
        console.info("jQuery call has no elements!", arguments);
    return result;
};

它仍然会为语法错误的选择器抛出错误，但假设你有一个正确的$('#test')，如果不存在#test，它至少会警告你。有利于开发，帮助解决拼写错误等

我已经用.on() 和其他东西做了这个，它非常强大。

【讨论】：