在前端开发中，JQuery是广泛使用的JavaScript库之一。然而，当我们要使用JQuery选择器来获取特定元素时，可能会遇到一个问题：当元素标签名中包含点（"."）时，选择器无法正常工作。
问题分析
对于以下HTML代码：
---- ------------------ --------------------------------------- ------
如果我们想选择<my.custom-element>元素，我们可以使用如下的JQuery选择器：
----------------------
但是，这段代码并不能正常工作。相反，它会抛出一个错误：“Uncaught Error: Syntax error, unrecognized expression: my.custom-element”。
这是因为在JQuery选择器中，“.”被用作类选择器和属性选择器的分隔符。所以，当元素名称中包含点时，JQuery选择器将尝试将其识别为类或属性选择器的一部分，而不是元素名称的一部分，导致选择器无法正确解析。
解决方案
为了解决这个问题，我们需要将包含点的元素标签名转换为合法的CSS选择器。可以使用两种方法来实现：
方法一：使用反斜杠转义
我们可以在元素名称中的每个点前面添加一个反斜杠来转义它们。例如，在上面的示例中，我们可以使用以下选择器：
------------------------
这样就可以正确地选中<my.custom-element>元素了。
方法二：使用属性选择器
另一种方法是使用属性选择器来选择元素。我们可以将包含点的元素标签名作为“[attribute=value]”中的属性值来选择元素。例如，在上面的示例中，我们可以使用以下选择器：
-------------------------------
这样也可以正确地选中<my.custom-element>元素了。
总结
在JQuery选择器中，当元素名称中包含点时，选择器无法正常工作。为了解决这个问题，我们可以使用反斜杠转义或属性选择器来选择包含点的元素。通过了解这些技术，我们可以更好地处理不同类型的元素选择器，并避免选择器错误。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/29516