Question

JS引号问题

this.style.width="500px"
this.style.width=500+"px"
感觉不一样，怎么结果是一样的呢
为什么这样写this.style.width=500px就是错的呢？？？

Answer 1

.style.width和style.height可以接受两种类型的赋值，一种是字符串，一种是数字，当使用数字时，一般情况下默认是使用px即像素作为单位的。

在js里面，字符串的连接符是 “+”（加号）,500+"px"里的500也会被当做字符串处理,所以完整的字符串"500px"和500+"px"的效果是一样.

而这一句：

this.style.width=500px

500px既不是数字，也不是字符串，肯定会报错，解释器会将px当做一个变量来处理，500还是被当做数字的，解释器会认为500和px中间少了界定符或运算符，所以会报： "缺少 ';'"   错误，而不是报："500px 不是一个有效的变量"或者"500px未定义"。

 

PS： To okbuzhidao112 朋友：在js中，使用不存在的变量时报的错误是：

xx未定义

缺少界定符报的错误才是：

缺少 ';'

追问

多谢多谢，想再问下
JS中什么时候该用引号，什么时候不加引号呢

追答

表示字符串的时候用引号，便是变量的时候不用引号（注意：合法变量名称为字符或下划线开头，后面可跟数字或或字符或下划线）。
在你的这个例子中，主要还是要看=号前面的对象的属性所能接受的数据类型，如style.width支持数字和字符串类型，而有一些对象的属性则只能支持数字，如果传入了数字以外的内容会出错或者有异常，但是因为JS是弱类型语言，所以一般不会报错，只是程序运行结果和预期的会有很大的不同。所以在使用的时候应传入该对象的属性所支持（或推荐的类型）。
当传入的是变量（合法变量名称）的时候，就无需使用引号。如：
var a="变量";
var b=a; //a是变量，不需要加引号。

追问

=号后面的如果可以接受数字类型，那么数字可以不用加引号 对吗？
另外onmouseover=“ ” 这个引号是有什么含义呢？

追答

你好，

“=号后面的如果可以接受数字类型，那么数字可以不用加引号 对吗？”

对的，不用加引号。

另外onmouseover=“ ”    这个引号是有什么含义呢？

之所以

<div onmouseover="doSomehing()" class="aaa">&nbsp;</div>

这样用，是为了遵循HTML的w3c推荐的语法规则，在这里，onmouseover其实算不上js,它是由DOM提供的一个接口，在这里，它只是div的一个属性，类似class="aaa"一样的意思。当发生鼠标在上面移动的事件时才会由DOM将引号里的js代码激活调用。

Answer 2

因为不再引号里边的内容是js的变量，同时js的变量不能是数字开头

500px没有引号被识别成变量不符合变量的要求，所以会报错
就算他被当成一个变量，那么使用一个不存在的变量js是会报错的

追问

那this.style.width=500+"px" 这个500也不在引号里面啊
为什么typeof(500+"px") 会是一个字符串呢

另外到底什么时候该用引号，什么时候不用加引号呢，比如调用函数的时候为什么要加引号呢等等？

Answer 3

500 + "px"会产生一个字符串拼接的效果，会自动把数字和字符串合并为一个新的字符串，结果等价于"500px"。
500px，sorry这个完全是错误的写法，既不是一个合法的变量名！又不是一个合法的数值！

附注：所有的style成员的值，都是字符串类型的。所以你通过this.style.xxx进行样式修改的时候，必须赋一个字符串值。

Answer 4

你要先搞清楚js中这些运算符的优先级，=和+的优先级肯定是+的优先级高，所以他会先计算右边表达式的值，就是500+“px”,一个数字加上一个字符串肯定最后是一个字符串啊。

Answer 5

500+'px' 是数字+字符串的操作, JS会把数字转换为字符串'500'后再与'px'做加法, 所以500+'px'= '500'+'px'='500px'.

你直接写width=500px, 这个500px既不是数字也不是字符串啊, JS会认为500px是一个变量名, 所以width=500px, 就相当于var 500px, width=500px, 由于var 500px这个变量没有赋值, 是null, 所以width=500px, 就相当于width=null