zoukankan      html  css  js  c++  java
  • 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>
    仔细观察弹出来的模态框,看看字符串是怎么样的?应该就会明白了。
    转载请注明出处[http://samlin.cnblogs.com/

    欢迎关注本人公众号:

    作者赞赏
  • 相关阅读:
    68.css 3d 卡片翻转效果
    67.canvas绘制常规图形
    66.环形加载动画(canvas/svg)
    65.canvas画一个表(2)
    64.canvas画一个表(1)
    63.实现一个拖拽排序
    62.textarea 自适应高度
    co co a P o a d s的使用
    在MJRefresh的基础上实现动画的自定义和自动下拉刷新
    iOS26 AFNetworking
  • 原文地址:https://www.cnblogs.com/samlin/p/1010849.html
Copyright © 2011-2022 走看看