js技巧--转义符"\"的妙用

 

通常，我们在动态给定一个container的innerHTML时，通常是样做的：
< div  id ="divc"   />
< SCRIPT  LANGUAGE ="JavaScript" >
var  div  =  document.getElementById( " divc " );
var  html  =   ""
html  +=   ""
+   " <h1> "
+   " <a href='javascript:;' onclick=\ " alert( ' javascript ' )\ " >DHTML innerHTML propery.</a> "
+   " </h1> " ;
div.innerHTML  =  html;
</ SCRIPT >

写得习惯了的话，倒也不麻烦，但有没有更简单的一个方法呢？请看下面的例子：

< SCRIPT  LANGUAGE ="JavaScript" >
var  html = ' \
<table width="100%" border="0" cellspacing="0" cellpadding="0">\
<tr>\
<td>&nbsp;</td>\
</tr>\
<tr>\
<td>&nbsp;</td>\
</tr>\
</table>\
' ;
alert(html);
</ SCRIPT >
是不是没有这么麻烦了？但还是要有几点注意，看下面的例子
< SCRIPT  LANGUAGE ="JavaScript" >
// 要用\'把单引号转义
var  html = ' \
<h1>\
javascript技巧\
</h1>\
<a href="javascript:;" onclick="alert(\ ' javascript\ ' )">javascript转义</a></font>\
<br/>\
power by \ ' blueDestiny, never - online\ ' \
' ;
alert(html);
</ SCRIPT >
该转义的地方还是得用"\"

'-------------------------------------------------------
' 原理：
'-------------------------------------------------------
这个是我自己的个人观点，如果有不对的地方，请指出：
还是看个例子：
< SCRIPT  LANGUAGE ="JavaScript" >
// s1和s2的字符a前都有一个空格
s1 = ' \
a ' ;
s2 = '  a ' ;
document.write( " s1:  "   +  s1.length  +   " \ns2:  "   +  s2.length);
</ SCRIPT >
输出结果：
s1: 2 s2: 2
也就是说转义符将回车转义掉了！也就是说
再看个例子：
< SCRIPT  LANGUAGE ="JavaScript" >
// 下面这个字符串是有空格的，也就是这样s1='\ 的。
s1 = ' \ 
a ' ;
document.write( " s1:  "   +  s1.length);
</ SCRIPT >
输出错误，错误提示：未结束字符串常量。
也就是说是多加了一个空格的原因。那再这样试试
< SCRIPT  LANGUAGE ="JavaScript" >
s1 = ' \ \
a ' ;
document.write( " s1:  "   +  s1.length);
</ SCRIPT >
结果很明显了，在字符串中，"\"转义符可以将回车转义掉（也就是回车符不存在了），但是不能将制表符，以及空格字符转义（它们是存在的，上面的例子说明了这一点）。

最后，给大家一个小tips，还记得上面的这个代码吗？
< SCRIPT  LANGUAGE ="JavaScript" >
// 要用\'把单引号转义
var  html = ' \
<h1>\
javascript技巧\
</h1>\
<a href="javascript:;" onclick="alert(\ ' javascript\ ' )">javascript转义</a></font>\
<br/>\
power by \ ' blueDestiny, never - online\ ' \
' ;
alert(html);
</ SCRIPT >
仔细观察弹出来的模态框，看看字符串是怎么样的？应该就会明白了。