浅析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 相关文章推荐
IE和FireFox(FF)中js和css的不同
Apr 13 Javascript
THREE.JS入门教程(3)着色器-下
Jan 24 Javascript
div模拟选择框示例代码
Nov 03 Javascript
利用js正则表达式验证手机号,email地址,邮政编码
Jan 23 Javascript
使用window.prompt()实现弹出用户输入的对话框
Apr 13 Javascript
javascript+html5实现仿flash滚动播放图片的方法
Apr 27 Javascript
jQuery mobile 移动web(6)
Dec 20 Javascript
js实现正则匹配中文标点符号的方法
Dec 23 Javascript
JS遍历页面所有对象属性及实现方法
Aug 01 Javascript
深入理解JavaScript中Ajax
Aug 02 Javascript
addeventlistener监听scroll跟touch(实例讲解)
Aug 04 Javascript
浅谈ElementUI中switch回调函数change的参数问题
Aug 24 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获取文件绝对路径的代码(上一级目录)
2011/05/29 PHP
laravel 5.1下php artisan migrate的使用注意事项总结
2017/06/07 PHP
php压缩文件夹最新版
2018/07/18 PHP
如何让PHP编码更加好看利于阅读
2019/05/12 PHP
一直复略了的一个问题,关于表单重复提交
2007/02/15 Javascript
JS backgroundImage控制
2009/05/19 Javascript
jQuery帮助之筛选查找 children([expr])
2011/01/31 Javascript
Jquery 切换不同图片示例代码
2013/12/05 Javascript
js获得页面的高度和宽度的方法
2014/02/23 Javascript
JS实现让访问者自助选择网页文字颜色的方法
2015/02/24 Javascript
jquery实现表单验证并阻止非法提交
2015/07/09 Javascript
jQuery+CSS实现滑动的标签分栏切换效果
2015/12/17 Javascript
js实现内容显示并使用json传输数据
2016/03/16 Javascript
基于Bootstrap实现Material Design风格表单插件 附源码下载
2016/04/18 Javascript
HTML中setCapture、releaseCapture 使用方法浅析
2016/09/25 Javascript
JSON与js对象序列化实例详解
2017/03/16 Javascript
vue生成token保存在客户端localStorage中的方法
2017/10/25 Javascript
vue之浏览器存储方法封装实例
2018/03/15 Javascript
JS实现为动态创建的元素添加事件操作示例
2018/03/17 Javascript
Openlayers实现地图的基本操作
2020/09/28 Javascript
编写同时兼容Python2.x与Python3.x版本的代码的几个示例
2015/03/30 Python
python 读写中文json的实例详解
2017/10/29 Python
详解Python自建logging模块
2018/01/29 Python
python如何把嵌套列表转变成普通列表
2018/03/20 Python
python如何生成各种随机分布图
2018/08/27 Python
深入浅析Python2.x和3.x版本的主要区别
2018/11/30 Python
浅析Python语言自带的数据结构有哪些
2019/08/27 Python
Python模块汇总(常用第三方库)
2019/10/07 Python
python写一个随机点名软件的实例
2019/11/28 Python
html5实现canvas阴影效果示例
2014/05/07 HTML / CSS
世界各地的旅游、观光和活动:Isango!
2019/10/29 全球购物
百度JavaScript笔试题
2015/01/15 面试题
2013年学期结束动员演讲稿
2014/01/07 职场文书
党支部书记岗位职责
2015/02/15 职场文书
Django给表单添加honeypot验证增加安全性
2021/05/06 Python
如何使用SQL Server语句创建表
2022/04/12 SQL Server