前几天解决一个外网问题,客服反馈页面数据加载不出来,首先看一下服务端日志也没报错异常,自己测试了一下,在chrome的Console发现有js报错,原来是js报错导致的数据加载不出来。

调试了一番,发现有一部分页面是根据服务端返回的数据拼接的html。返回的数据某字段带有括号,从而生成的html类似<div id="id(xxx)">aa</div>。然后在通过id获取时取不到数据,所以导致js报错的。

最快的解决办法在后台管理系统修改了数据,把括号去掉了,页面正常了。

一般情况下,在jQuery选择器中,我们很少会用到诸如“.”、“#”、“(”、“[”等特殊字符,因为根据W3C规定,HTML文档中属性的值是不能包含有这些个特殊字符的,但是在实际应用中,偶尔也会遇到表达式中含有“#”和“.”等特殊字符

那么是如何处理这些个特殊字符的呢?

要想让jQuery能处理这些特殊字符,使用普通的方式处理的话,必须要进行转义。

HTML代码:

<div id="id.a">aa</div>
<div id="id#b">bb</div>

js代码:

var $id_a  = $('#id.a');//jQuery对象,实际上是没取到元素的

var $id_b  = $('#id#b');//jQuery对象,实际上是没取到元素的

alert( $id_a.length);//输出0

alert( $id_b.length);//输出0

var $id_right_a  = $('#id\\.a');//jQuery对象,对特殊字符,我们转义一下

var $id_right_b  = $('#id\\#b');//jQuery对象,对特殊字符,我们转义一下

alert( $id_right_a.html() );//正确输出"aa"

alert( $id_right_b.html() );//正确输出"bb"

  

处理jQuery选择器中的特殊符号,如(、#等的更多相关文章

  1. jQuery选择器中的特殊符号和关键字

    一般情况下,在jQuery选择器中,我们很少会用到诸如"."."#"."("."["等特殊字符,因为根据W3C规定,HT ...

  2. JQuery选择器中的一些注意事项

    1. 选择器中含有特殊符号的注意事项 1. 1 选择器中含有",","#","("或"]"等特殊字符 根据w3c的规定, ...

  3. jquery选择器中两个class是什么意思?

    jquery选择器中两个class是什么意思? $(".class1 .class2") 选择class1元素下class2的元素(中间有空格)$(".class1.cl ...

  4. jQuery选择器中的空格问题

    前几天就遇到过这样的问题,明明我用的是('tr :even').css('background','#ccc')想改变表格中行的背景色,反复试了还是没改变.还问了度娘还是没找到原因所在(当时问题描述的 ...

  5. jQuery选择器中空格的问题再探究

    jQuery选择器的空格问题,看似很小,但是差之毫厘谬以千里,让人很是恼火,<锋利的jQuery>书中有个经典的例子,我这里也拷贝下来,再加点自己的想法 <html> < ...

  6. JQuery选择器中含有冒号的ID处理差异的分析

    问题提出 对于一个输入框, 如果其id中含有冒号(:),选择器使用需要有特殊写法, 例如 id为下 <input type="text" value="ddd&qu ...

  7. jquery 选择器中含有空格注意

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. jquery选择器中的find和空格,children和>的区别、及父节点兄弟节点,还有判断是否存在的写法

     一.find和空格,children和>及其它的区别   空格:$('parent childchild')表示获取parent下的所有的childchild节点(所有的子孙). 等效成  = ...

  9. jQuery选择器中,通配符[id^='code']input[id$='code'][id*='code']

     1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&qu ...

随机推荐

  1. Yii2 基础学习

    <?php //url创建 echo Url::to(''); // same controller, different action // /index.php?r=management/d ...

  2. 9 python 多态与多态类

    1.多态定义 多态指的是一类事物的多种形态 比如动物有多种形态:人,狗,猪 import abc class Animal(metaclass=abc.ABCMeta): @abc.abstractm ...

  3. java 观察者模式 与spring配置

    一.Observer模式的意图: 在对象的内部状态发生变化时,自动通知外部对象进行响应. 二.Observer模式的构成: ·被观察者:内部状态有可能被改变,而且又需要通知外部的对象 ·观察者:需要对 ...

  4. 【346】TF-IDF

    Ref: 文本挖掘预处理之向量化与Hash Trick Ref: 文本挖掘预处理之TF-IDF Ref: sklearn.feature_extraction.text.CountVectorizer ...

  5. nginx的配置文件解析

    worker_processes ;#工作进程的个数,一般与计算机的cpu核数一致 events { worker_connections ;#单个进程最大连接数(最大连接数=连接数*进程数) } h ...

  6. JSP通过表格显示数据库的信息

    [step one] 1-1 建立数据库 在jsp中,我们使用的是mysql数据库,对于此数据的优缺点本篇不予以讲述,首先建立news数据库,其数据库中表的信息为: eg:< id :1 ; n ...

  7. R画散点图、线型图、箱型图、直方图基本知识

    1.导入数据 2.散点图 plot(iris[,1]~iris[,4],xlab='Length',ylab='Width',col='red',main='Length VS Width')

  8. Wilcoxon Signed Rank Test

    1.Wilcoxon Signed Rank Test Wilcoxon有符号秩检验(也称为Wilcoxon有符号秩和检验)是一种非参数检验.当统计数据中使用“非参数”一词时,并不意味着您对总体一无所 ...

  9. JAVA——遍历

    关于遍历,发现了个坑. 详见如下: package com.fxl.test; import java.util.ArrayList; import java.util.Iterator; impor ...

  10. byte,short,int,long数据之间的倍数关系

    基本数据类型 byte   =  -128和127------------------------------------------------------------2的8次方,1个字节 shor ...