使用jQuery选择带冒号的ID

Question

我正在为一个网站开发一个预先编写的模块,我需要使用id来定位一个元素test:two.现在,这个元素中有一个冒号,所以jQuery可能是可以理解的,将'two'看作伪类.有没有办法用jQuery来定位这个元素？

此外,无法更改ID.相信我,如果我能,我会.

我举了一个例子:

$('#test').css('background','red');
$(document.getElementById('test:two')).css('background','blue');
$('#test:two').css('background','green');

<script src="//code.jquery.com/jquery-1.6.3.js"></script>

<div id="test">test</div>
<div id="test:two">test two</div>

Answer 1

只需用以下方法逃脱结肠\\:

$('#test\\:two');

http://jsfiddle.net/zbX8K/3/

请参阅文档:如何通过具有CSS表示法中使用的字符的ID选择元素？.

Answer 2

从jQuery ID Selector docs:

如果id包含句点或冒号等字符,则必须使用反斜杠转义这些字符.

因为反斜杠本身需要在字符串中进行转义,所以您需要这样做:

$("#test\\:two")

$('#test').css('background','red');
$(document.getElementById('test:two')).css('background','blue');
$('#test\\:two').css('background','green');

<script src="//code.jquery.com/jquery-1.6.3.js"></script>

<div id="test">test</div>
<div id="test:two">test two</div>

您现在还可以选择使用内置CSS.escape(...)函数,该函数负责处理选择器表达式中可能具有特殊含义的任何字符.

$("#" + CSS.escape("test:two"))

$('#test').css('background','red');
$(document.getElementById('test:two')).css('background','blue');
$("#" + CSS.escape("test:two")).css('background','green');

<script src="//code.jquery.com/jquery-1.6.3.js"></script>

<div id="test">test</div>
<div id="test:two">test two</div>

Answer 3

使用属性equals选择器.

$('[id="test:two"]')

Answer 4

尝试使用属性选择器

$(document).ready(function() {
    $('div[id="test:two"]').each(function() {
       alert($(this).text());
    }); 
});

小提琴:http://jsfiddle.net/zbX8K/2/