必威体育Betway必威体育官网
当前位置:首页 > IT技术

JavaScript中的单引号的双引号

时间:2019-10-01 16:43:22来源:IT技术作者:seo实验室小编阅读:90次「手机版」
 

引号

更多文章 访问我的博客:http://www.caoyong.xin:8080/blogger

javaScript中的单引号和双引号

今天来聊一聊单引号和双引号在JavaScript中的使用,做web的经常会在HTML中或者JavaScript中拼接字符串,这个时候就会用到单引号与双引号混合使用,如果使用不当还会造成意想不到的bug。

单引号和双引号都可以作为字符串的开始符和关闭符,并且只能‍同一种单或者双引号来定义开始和结束;

在同一种引号中使用相同的引号,需要转义后才能使用。不同引号可以嵌套使用。

下面就来聊一聊这些小细节。

首先,描述一下,具体的应用场景。

第一:从后台界面传递的数据在HTML或者jsp页面展示的时候,我们可能把这些数据直接展示,又或者以变量的形式传递给js函数

第二:我们用到ajax的时候,从后端异步获取数据,需要把这些数据结合HTML标签CSS属性拼接在一起,然后斧子给某个标签在页面上展示。

具体来说一些这些应用场景。

第一:在HTML或者Jsp中使用

有一个需求,在后台传递一个List集合的数据将要在前台页面展示

QQ截图20180411135326.png

前台页面

QQ截图20180411135425.png

我们看οnclick="test('${str}')"我们给js函数test()需要传递一个参数,这个时候就需要用到双引号中嵌套单引号,为什么要加上单引号,那是因为我们传递的是一个字符串所以要加上单引号(如果是数字可以不加,但是有的时候会出现问题,下面会提到,所以最好都要加上引号),你可能会说,如果加上双引号了?可以加双引号但是前提你要使用转义字符的双引号才可以

使用浏览器开发者模式查看代码

QQ截图20180411140216.png

就可以看到双引号中嵌套双引号了

你可能想说我们一般的转义不就是加上反斜杠(\)不就可以了吗?

但是在HTML,却不可以,要使用转义字符才可以。

单引号的转义字符 '

双引号的转义字符"

既然提到了这,我就说一个我遇到的一个相关问题,只这样的又一次我将32位的UUID传递给js函数,但是却给我返回的是科学计数法,TMD,这个问题搞了我半天。

QQ截图20180411141936.png

结果:

QQ截图20180411142022.png

加上单引号以后就正常了。

第二:在JavaScript中使用

最多的就是使用Ajax异步获取数据,拼接字符串。

场景复原

首先我们通过Ajax获取后台数据是一个list的集合数据接下来我们要在js中循环遍历这个list,然后拼接字符串,最后将字符串赋值给一个p进行页面展示

js代码展示

QQ截图20180411150514.png

网页源码展示

QQ截图20180411150549.png

下面我们就来解释一下

html += "<a href='' οnclick='show(\""+data[i]+"\")'>"+data[i]+"</a><br>";

首先我们可以看到有一个html的变量用于存放拼接字符串,最外层有一个双引号(也可以是单引号),在第一层里面我们用的都是单引号,如href=''

οnclick='',(我说的是第一层),这里也就说明了,为什么同种引号内不能使用同种引号(指的是父子关系),可以嵌套使用,比如 双引号中使用单引号,然后单引号中在使用双引号。这是允许的。

接下来我们看οnclick='show(\""+data[i]+"\")'

\" 表示转义双引号,后面又跟了一个双引号是与最开始的双引号呼应,"<a href='' οnclick='show(\""是个字符串而字符串的内容就是

<a href='' οnclick='show(\"后面的data[i]就是另一个字符串,我们知道字符串的拼接需要用加号连接,所以这里也就好理解为什么要在data[i]两边加上加号了。再到后面"\")'>"又是一个字符串内容是\")'。接着后面"</a><br>";是一个字符串。而"</a><br>"与"<a href='' οnclick='show(\""+data[i]+"\")'>"之间的data[i]需要用两个加号拼接前后的字符串。

说到这里总则要记住上面提到的规则,那么我们在面对单引号或者双引号拼接字符串的时候就会得心应手了!。

相关阅读

Linux Bash环境下对单引号、双引号和反引号的处理

Bash在扫描命令行的过程中,类似于编译器的预编译过程。Bash首先在文本层次上,优先解释所有的特殊字符,再对转换完成的新命令行进行内

latex中如何正确输入 双引号

latex中输入双引号时,如果都直接用键盘上的双引号键,打出的是一顺撇的。左面引号的正确输入法是:按两次“Tab上面,数字1左面那个键”

分享到:

栏目导航

推荐阅读

热门阅读