用jQuery处理元素ID中的冒号

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (46)

我们无法使用jQuery在JS代码中访问ID为“test:abc”的div元素。

<div id="test:abc">

$('#test:abc') 

它没有冒号工作正常。我们没有对ID生成的控制,因为它是在Trinidad子表单中自动生成的,因为它将子表单ID附加:到其中的每个元素。

提问于
用户回答回答于

简而言之

$(document.getElementById("test:abc")) 是你应该使用的。

例如:你有一个功能

   function doStuff(id){

       var jEle = $("#" + id); //is not safe, since id might be "foo:bar:baz" and thus fail. 
       //You would first have to look for ":" in the id string, then replace it

       var jEle = $(document.getElementById(id)); //forget about the fact 
      //that the id string might contain ':', this always works
    }

    //just to give an idea that the ID might be coming from somewhere unkown
    var retrievedId = $("foo").attr("data-target-id");
    doStuff(retrievedId); 

速度/时间

看看这个jsbin,它测试和比较ID和冒号的选择方法的速度

你需要打开你的控制台才能得到结果。

我用firefox 10和jquery 1.7.2测试了它

基本上我做了一个选择10'000次的div与冒号在id - 用不同的方法来实现它。然后我把结果与没有冒号的ID选择进行比较,结果相当令人惊讶。

剩余时间以毫秒右选择器方式

299 $("#annoying\\:colon")

302 $("[id='annoying:colon']"

20 $(document.getElementById("annoying:colon"))


71 $("#nocolon")

294 $("[id='nocolon']")

特别

  71 $("#nocolon") and
299 $("#annoying\\:colon")
用户回答回答于

你需要使用两个反斜杠来转义冒号:

$('#test\\:abc')

扫码关注云+社区

领取腾讯云代金券