浅析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 相关文章推荐
jquery $.ajax()取xml数据的小问题解决方法
Nov 20 Javascript
Extjs表单常见验证小结
Mar 07 Javascript
JS实现新浪博客左侧的Blog管理菜单效果代码
Oct 22 Javascript
Js的Array数组对象详解
Feb 22 Javascript
jQuery密码强度验证控件使用详解
Jan 05 Javascript
JS+canvas动态绘制饼图的方法示例
Sep 12 Javascript
javascript深拷贝、浅拷贝和循环引用深入理解
May 27 Javascript
vue配置接口域名方法总结
May 12 Javascript
webpack4 从零学习常用配置(小结)
May 28 Javascript
EasyUI 数据表格datagrid列自适应内容宽度的实现
Jul 18 Javascript
Vue项目中Api的组织和返回数据处理的操作
Nov 04 Javascript
微信小程序后端无法保持session的原因及解决办法问题
Mar 20 Javascript
表单元素与非表单元素刷新区别详细解析
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使用CURL伪造IP和来源实例详解
2015/01/15 PHP
完美利用Yii2微信后台开发的系列总结
2016/07/18 PHP
PHP5.5新特性之yield理解与用法实例分析
2019/01/11 PHP
PHP如何开启Opcache功能提升程序处理效率
2020/04/27 PHP
Javascript实现的类似Google的Div拖动效果代码
2011/08/09 Javascript
基于jQuery+HttpHandler实现图片裁剪效果代码(适用于论坛, SNS)
2011/09/02 Javascript
有关于eclipse配置spket需要注意的一些地方
2013/04/07 Javascript
javascript对象的使用和属性操作示例详解
2014/03/02 Javascript
Jquery跳到页面指定位置的方法
2014/05/12 Javascript
一个通过script自定义属性传递配置参数的方法
2014/09/15 Javascript
js控制鼠标事件移动及移出效果显示
2014/10/19 Javascript
JavaScript中的toLocaleDateString()方法使用简介
2015/06/12 Javascript
jQuery实现jQuery-form.js实现异步上传文件
2017/04/28 jQuery
nodejs处理图片的中间件node-images详解
2017/05/08 NodeJs
基于JavaScript实现无缝滚动效果
2017/07/21 Javascript
JS实现移动端整屏滑动的实例代码
2017/11/10 Javascript
Koa2微信公众号开发之本地开发调试环境搭建
2018/05/16 Javascript
vue如何解决循环引用组件报错的问题
2018/09/22 Javascript
13 个npm 快速开发技巧(推荐)
2019/07/04 Javascript
layui实现数据分页功能(ajax异步)
2019/07/27 Javascript
webpack的tree shaking的实现方法
2019/09/18 Javascript
关于uniApp editor微信滑动问题
2021/01/15 Javascript
js canvas实现五子棋小游戏
2021/01/22 Javascript
[17:36]VG战队纪录片
2014/08/21 DOTA
pandas 根据列的值选取所有行的示例
2018/11/07 Python
将python运行结果保存至本地文件中的示例讲解
2019/07/11 Python
基于梯度爆炸的解决方法:clip gradient
2020/02/04 Python
python 还原梯度下降算法实现一维线性回归
2020/10/22 Python
python中append函数用法讲解
2020/12/11 Python
Merrell迈乐澳大利亚网站:购买户外登山鞋
2017/05/28 全球购物
美国购买舞会礼服网站:Couture Candy
2019/12/29 全球购物
道德大讲堂实施方案
2014/05/14 职场文书
社区助残日活动总结
2014/08/29 职场文书
学习退步检讨书
2014/09/28 职场文书
试用期辞职信范文
2015/03/02 职场文书
青年岗位能手事迹材料(2016推荐版)
2016/03/01 职场文书