如何选择带有特殊字符的ID元素？

5 浏览
0 Comments

如何选择带有特殊字符的ID元素？

我有一个带有一个包含很多带有“奇怪名称”的输入框的网页，用来模拟一个数组：

我如何使用jQuery设置这些输入框的值，具体来说，我应该如何选择它们？我尝试了很多种方法，但都没有成功。

0

3 答案

0 Comments

问题：如何选择带有特殊字符的ID元素？

原因：在选择器中，需要对ID中的特殊字符进行转义，包括[、]、@和.字符。

解决方法：使用\\对特殊字符进行转义。

代码示例：

var val = $('#Punteggi\\[\\\\]\\.Descrizione').val();
console.log(val);

HTML示例：

0
0 Comments

在处理DOM和CSSOM方面，为了使选择带有特殊字符的元素更容易，无论是对于使用jQuery的用户还是非使用jQuery的用户，都进行了更多的开发。为了解决这个问题，可以使用CSS.escape()方法。下面是一个使用jQuery和不使用jQuery的解决方法的示例代码：

使用jQuery：

var id = "Punteggi[].Descrizione";
var selector = `#${CSS.escape(id)}`;
var val = $(selector).val();
console.log(val);

不使用jQuery：

var id = "Punteggi[].Descrizione";
var selector = `#${CSS.escape(id)}`;
var val = document.querySelector(selector).value;
console.log(val);

以上代码中，首先定义了一个包含特殊字符的id变量。然后使用CSS.escape()方法对id进行转义，生成转义后的选择器字符串。最后，通过该选择器字符串选取相应的元素，并获取其值。

使用这种方法，无论是使用jQuery还是不使用jQuery，都可以轻松地选择和操作带有特殊字符的元素。这种方法的出现是为了解决在ID中使用特殊字符时可能导致选择器无法正常工作的问题。

0
0 Comments

问题的原因是CSS中的括号和点具有特殊含义，括号可用作属性选择器，点可用作类选择器。为了解决这个问题，可以尝试使用$.escapeSelector函数来转义选择器中的特殊字符，代码如下：

$('#' + $.escapeSelector('Punteggi[].Descrizione'))

这样可以确保特殊字符不会影响选择器的选择结果。另外一种解决方法是使用属性选择器，并将其用引号括起来，代码如下：

$('[id="Punteggi[].Descrizione"]')

这样可以确保ID完全匹配，不会将特殊字符解释为特殊含义。

0