浅析Js中的单引号与双引号问题


Posted in Javascript onNovember 06, 2013

单引号和双引号其实没啥区别,看你自己习惯了

<input type="button" onclick="alert("1")">-------------------不正确
<input type="button" onclick="alert('1')">-------------------正确

双引号中再用双引号要这样:
var str = "abc\"def\"ghi"
用反斜杠来禁止解析双引号。

下面是我摘录的,希望对你有用:

在一个网页中的按钮,写onclick事件的处理代码,不小心写成如下:
<input value="Test" type="button" onclick="alert(""OK"");" />

IE提示出错后,再漫不经心地改为:
<input value="Test" type="button" onclick="alert(\"OK\");" />

结果还是出错。
这时,我就想不通了,虽然我知道最直接的解决方法是写成这样:
<input value="" type="button" onclick="alert('OK');" />
但为什么javascript中的转义字符\没有效果了呢?

后来找到一段正常的代码:
<input value="Test" type="button" onclick="alert("OK");" />
这时才理解,原来这时,还是归于HTML的管辖范围,所以转义字符应该使用HTML的,而不是javascript的。两个双引号的做法是vbScript的,\"这种做法则是javascript的,而HTML的,则是用",此外还可以使用:"、'。

下面列出各种表达方法:

<html>
<body>
<input value="外双引号内双引号-错误" type="button" onclick="alert("OK");" /><br />
<input value="外单引号内单引号-错误" type="button" onclick='alert('OK');' /><br />
<input value="两个双引号-错误" type="button" onclick="alert(""OK"");" /><br />
<input value="两个单引号-错误" type="button" onclick="alert(''OK'');" /><br />
<input value="\+双引号-错误" type="button" onclick="alert(\"OK\");" /><br />
<input value="\+单引号-错误" type="button" onclick="alert(\'OK\');" /><br />
<input value="外双引号内单引号-OK" type="button" onclick="alert('OK');" /><br />
<input value="外单引号内双引号-OK" type="button" onclick='alert("OK");' /><br />
<input value="外部不使用引号-OK" type="button" onclick=alert('OK');alert("OK"); /><br />
<input value="HTML转义字符"(& # 3 4 ;)-OK" type="button" onclick="alert("OK");" /><br />
<input value="HTML转义字符'(& # 3 9 ;)-OK" type="button" onclick="alert('OK');" /><br />
<input value="HTML转义字符"(& # x 2 2 ;)-OK" type="button" onclick="alert('OK');" /><br />
<input value="HTML转义字符'(& # x 2 7 ;)-OK" type="button" onclick="alert('OK');" /><br />
<input value="HTML转义字符"(& q u o t ;)-OK" type="button" onclick="alert("OK");" /><br />
<input value="HTML转义字符'(& a p o s ;)-IE错误" type="button" onclick="alert('OK');" /><br />
<input value="其它\\-错误" type="button" onclick="alert(\\"OK\\");" /><br />
<input value="其它\& # 3 4 ;-错误" type="button" onclick="alert(\"OK\");" /><br />
</body>
</html>
Javascript 相关文章推荐
用JS操作FRAME中的IFRAME及其内容的实现代码
Jul 26 Javascript
屏蔽Flash右键信息的js代码
Jan 17 Javascript
jQuery)扩展jQuery系列之一 模拟alert,confirm(一)
Dec 04 Javascript
jquery命令汇总,方便使用jquery的朋友
Jun 26 Javascript
jQuery插件windowScroll实现单屏滚动特效
Jul 14 Javascript
用js读写cookie的简单方法(推荐)
Aug 08 Javascript
angularjs2中父子组件的数据传递的实例代码
Jul 05 Javascript
详解webpack2+node+react+babel实现热加载(hmr)
Aug 24 Javascript
node.js+express+mySQL+ejs+bootstrop实现网站登录注册功能
Jan 12 Javascript
在Vue组件上动态添加和删除属性方法
Feb 23 Javascript
js数据类型检测总结
Aug 05 Javascript
如何在VUE中使用vue-awesome-swiper
Jan 04 Vue.js
表单元素与非表单元素刷新区别详细解析
Nov 06 #Javascript
js onclick事件传参讲解
Nov 06 #Javascript
jquery validation验证身份证号,护照,电话号码,email(实例代码)
Nov 06 #Javascript
css样式标签和js语法属性区别
Nov 06 #Javascript
jquery 设置元素相对于另一个元素的top值(实例代码)
Nov 06 #Javascript
jQuery中$.fn的用法示例介绍
Nov 05 #Javascript
可选择和输入的下拉列表框示例
Nov 05 #Javascript
You might like
批量去除PHP文件中bom的PHP代码
2012/03/13 PHP
PHP实现动态执行代码的方法
2016/03/25 PHP
JQUERY 浏览器判断实现函数
2009/08/20 Javascript
js变换显示图片的实例
2013/04/16 Javascript
js定时调用方法成功后并停止调用示例
2014/04/08 Javascript
js和jquery如何获取图片真实的宽度和高度
2014/09/28 Javascript
Bootstrap 模态框实例插件案例分析
2016/12/28 Javascript
利用HTML5+Socket.io实现摇一摇控制PC端歌曲切换
2017/01/13 Javascript
JavaScript变量作用域_动力节点Java学院整理
2017/06/27 Javascript
vue使用vue-cli快速创建工程
2017/07/28 Javascript
浅谈angular2路由预加载策略
2017/10/04 Javascript
vue 实现 ios 原生picker 效果及实现思路解析
2017/12/06 Javascript
JavaScript arguments.callee作用及替换方案详解
2020/09/02 Javascript
[00:32]2018DOTA2亚洲邀请赛Liquid出场
2018/04/03 DOTA
[49:08]完美世界DOTA2联赛PWL S2 LBZS vs FTD.C 第一场 11.27
2020/12/01 DOTA
python使用 HTMLTestRunner.py生成测试报告
2017/10/20 Python
django自带的server 让外网主机访问方法
2018/05/14 Python
tensorflow: 查看 tensor详细数值方法
2018/06/13 Python
python web自制框架之接受url传递过来的参数实例
2018/12/17 Python
如何使用Python实现斐波那契数列
2019/07/02 Python
浅谈django 模型类使用save()方法的好处与注意事项
2020/03/28 Python
pyMySQL SQL语句传参问题,单个参数或多个参数说明
2020/06/06 Python
Python基于yaml文件配置logging日志过程解析
2020/06/23 Python
浅析Python 抽象工厂模式的优缺点
2020/07/13 Python
CSS3制作圆形滚动进度条动画的示例
2020/11/05 HTML / CSS
Sisley法国希思黎中国官网:享誉全球的奢华植物美容品牌
2019/06/30 全球购物
Java中的类包括什么内容?设计时要注意哪些方面
2012/05/23 面试题
软件工程师岗位职责
2013/11/16 职场文书
婚礼新郎父母答谢词
2014/01/16 职场文书
家庭教育先进个人事迹材料
2014/01/24 职场文书
暑期社会实践先进个人主要事迹
2014/05/22 职场文书
党员志愿者活动方案
2014/08/28 职场文书
食品质检员岗位职责
2015/04/08 职场文书
大学优秀学生主要事迹材料
2015/11/04 职场文书
javascript Number 与 Math对象的介绍
2021/11/17 Javascript
Vue.js中v-bind指令的用法介绍
2022/03/13 Vue.js