js中的引号嵌套问题

最新推荐文章于 2022-10-10 11:00:13 发布
最新推荐文章于 2022-10-10 11:00:13 发布
阅读量3.5k 收藏 3
点赞数 3
分类专栏： 前端 jquery javascript 文章标签： javascript 引号嵌套
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xyc_csdn/article/details/71007118
版权
前端 同时被 3 个专栏收录
26 篇文章 0 订阅
订阅专栏
jquery
12 篇文章 0 订阅
订阅专栏
javascript
11 篇文章 0 订阅
订阅专栏 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <h3>单引号</h3>
    <div id="single_quotes"></div>
    <hr/>
    <h3>双引号</h3>
    <div id="double_quotes"></div>
    <h3>打印区域</h3>
    <div id="print_box"></div>
  </body>
  <script type="text/javascript" src="jquery-3.0.0.min.js"></script>
  <script type="text/javascript">
    $(function(){
      oneLayerNesting();  //一层嵌套
      twoLayerNesting();  //两层嵌套
      threeLayerNesting();  //三层嵌套
      fourLayerNesting();  //四层嵌套
    });

    function oneLayerNesting(){
      $("#single_quotes").append('<input /><br/>');
      $("#double_quotes").append("<input /><br/>");
    }

    function twoLayerNesting(){
      $("#single_quotes").append('<input value="两层嵌套" /><br/>');
      $("#double_quotes").append("<input value='两层嵌套' /><br/>");
    }

    function threeLayerNesting(){
      var value = "三层嵌套";
      $("#single_quotes").append('<input value="三层嵌套-错误例子-1" onclick="printValue('+value+');" />');/*错误例子-1-点击报错:ReferenceError: \u4E09\u5C42\u5D4C\u5957 is not defined*/
      $("#double_quotes").append("<input value='三层嵌套-错误例子-1' onclick='printValue("+value+");' />");/*错误例子-1-点击报错:ReferenceError: \u4E09\u5C42\u5D4C\u5957 is not defined*/

      $("#single_quotes").append('<input value="三层嵌套-错误例子-2" onclick="printValue("'+value+'");" />');/*错误例子-2-显示错误:<input value="三层嵌套" onclick="printValue(" 三层嵌套");"="">*/
      $("#double_quotes").append("<input value='三层嵌套-错误例子-2' onclick='printValue('"+value+"');' />");/*错误例子-2-显示错误:<input value="三层嵌套" onclick="printValue(" 三层嵌套");"="">*/

      $("#single_quotes").append('<input value="三层嵌套-错误例子-3" onclick="printValue(\"'+value+'\");" />');/*错误例子-3-显示错误:<input value="三层嵌套" onclick="printValue(" 三层嵌套");"="">*/
      $("#double_quotes").append("<input value='三层嵌套-错误例子-3' onclick='printValue(\'"+value+"\');' />");/*错误例子-3-显示错误:<input value="三层嵌套" onclick="printValue(" 三层嵌套");"="">*/

      $("#single_quotes").append('<input value="三层嵌套-错误例子-4" onclick="printHtml(\"<input/>\");" />');/*错误例子-4-显示错误:<input value="三层嵌套-错误例子-4" onclick="printHtml(" <input="">*/
      $("#double_quotes").append("<input value='三层嵌套-错误例子-4' onclick='printHtml(\'<input/>\,);' />");/*错误例子-4-显示错误:<input value="三层嵌套-错误例子-4" onclick="printHtml(" <input="">*/

      $("#single_quotes").append('<input value="三层嵌套-正确例子-1" onclick="printValue(\''+value+'\');" />');/*正确例子-1*/
      $("#double_quotes").append("<input value='三层嵌套-正确例子-1' onclick='printValue(\""+value+"\");' />");/*正确例子-1*/

      $("#single_quotes").append('<input value="三层嵌套-正确例子-2" onclick="printHtml(\'<input/>\');" /><br/>');/*正确例子-2*/
      $("#double_quotes").append("<input value='三层嵌套-正确例子-2' onclick='printHtml(\"<input/>\");' /><br/>");/*正确例子-2*/
    }

    function fourLayerNesting(){
      $("#single_quotes").append('<input value="四层嵌套-错误例子-1" onclick="printHtml(\'<input value=\"四层嵌套\"/>\');" />');/*错误例子-1-显示错误:<input value="四层嵌套" onclick="printHtml('<input value=" 四层嵌套"="">*/
      $("#double_quotes").append("<input value='四层嵌套-错误例子-1' onclick='printHtml(\"<input value=\'四层嵌套\'/>\");' />");/*错误例子-1-显示错误:<input value="四层嵌套" onclick="printHtml('<input value=" 四层嵌套"="">*/

      //&apos;是单引号的转义符，&quot;是双引号的转义符
      $("#single_quotes").append('<input value="四层嵌套-正确例子" onclick="printHtml(\'<input value=&quot;四层嵌套-单引号&quot;/>\');" /><br/>');/*正确例子*/
      $("#double_quotes").append("<input value='四层嵌套-正确例子' onclick='printHtml(\"<input value=&apos;四层嵌套-双引号&apos;/>\");' /><br/>");/*正确例子*/
    }

    function printHtml(html){
      $("#print_box").append(html);
    }

    function printValue(value){
      console.log("value="+value);
    }
  </script>
</html>

通过以上运行结果可知，在js中的引号嵌套时单引号和双引号是交替使用的，基本规律如下(<=4层)： 

-   单引号：' " \' &quot; 单引号 &quot; \' " '
-   双引号：" ' \" &apos; 双引号 &apos; \" ' "

当然对于五层以上的嵌套目前还没有什么好的解决方案，不过4层嵌套已经可以解决绝大部分的应用场景了。

萧逸才
关注
专栏目录
JS中单引号和双引号嵌套传参的问题
XiaoBo_S的博客
02-23 2535
1、首先从本质上来说你在js或者jquery中使用单引号或者双引号是没有区别的，都可以成功被解析，但是关键在于有很多场景我们进行字符串拼接时会同时使用单引号和双引号这个时候要遵循一个原则：要成对嵌套使用，外层用单引号里面就用双引号，外层用双引号里面就用单引号 2、传参问题，如果你传递的参数仅仅是一个非字符型的变量的话按正常的写法不会有什么问题，但是我的一个需求如下， 我要在一段动态生成的h...
关于JavaScript的单双引号嵌套问题
11-30
单引号和双引号之间可以相互嵌套。 1、单引号内只能嵌套双引号。 2、双引号内只能嵌套单引号。 3、如果想在双引号内，再嵌套双引号，里面的双引号，一定要进行转义（\”）。 4、JS中的转义字符是反斜杠(\).常用的转义字符有：\’、\”、\\、\r、\n等。 转义字符也就是，当浏览器遇到反斜杠(\)时，将会对其后的一个字符进行特殊对待，当成一个一个普通字符来对待。所谓“普通”字符就是a、b、c、&等。 总结 以上所述是小编给大家介绍的关于JavaScript的单双引号嵌套问题 ，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！
javascript中引号嵌套
闷骚的男
12-24 3988
a-href语句里面的所有引号，在可以使用转义字符的情况下，单引号和双引号之间可以怎样变化，有几种表示方法？像这样遇到引号嵌套应该怎么套，有规律吗？是不是一般在单引号里面套双引号？ 当拼接JS字符串的时候，双引号里面一定要是单引号，单引号里面要是双引号。如此循环！不过全部双引号也可以，就是双引号里面的双引号需要转义！ 单引号 双引号嵌套使用时，要注意以下几点就可以了： 1. 单（双）引号开始 单（双）引号结束，配对使用 2. 单引号在前，后面是双引号 3. 双引号在前，单引号在后 4. 单引号在
js的引号多级嵌套
wei
11-20 426
在js中经常会写到引号的嵌套。 1.比如alert("abc"); 就没有嵌套的引号而言，alert('abc');一样正常工作，即使"coun tryId=" + $('#destCountry').val()单双混用也不会有问题。 2.再看引号里面嵌套引号的情况： $.each(data,function(i,n){ f += ''+ n.text + ''; }); ...
JavaScript中引号的嵌套
掬水月在手，弄花香满衣
03-15 149
在JavaScript中字符串是用引号“" "”、“' '”包起来的零个至多个字符。用哪个引号开始就用哪个结束，而且单双引号可嵌套使用，不过JavaScript 中引号的嵌套只能有一层。如果想再多嵌一些，需要用转义字符： 转义字符 由于一些字符在屏幕上不能显示，或者 JavaScript 语法上已经有了特殊用途，在要用这些字符时，就要使用“转义字符”。转义字符用斜杠“\”开头：\' 单引号、\"...
我遇到的参数传递中 双引号单引号嵌套问题
09-05
参数传递中双引号单引号嵌套问题解决方案 在编程中，参数传递是非常常见的一种操作，但是当我们需要在双引号中嵌套单引号时，问题就来了。在这篇文章中，我们将讨论如何解决参数传递中双引号单引号嵌套问题。 首先...
javascript JSON.parse解析双引号嵌套单引号格式的数据
01-07
JSON.parse() 方法用于将一个 JSON 字符串转换为对象。 >str1 = {'distance': 1, 'update_time': 'None', 'n_homalt_N_het': '13/3822', 'ratio': '-', 'quality': '451'} {'distance': 1, 'update_time': 'None', '...
js的单双引号嵌套问题
Da_Xiong的博客
10-10 5697
js的单双引号嵌套问题
js中引号嵌套
yaohaifang的专栏
04-22 838
上面的input本身就是一个2层引用的写法，如果将整个input再套一层引号，那么写法就：""这里的把戏是使用/"把里层的dateFmt引号转义。因为第一层"" 第二层，那么第三层直接使用""会将最外层引号范围提前结束. 到这里也许会有一种冲动去尝试3层嵌套的单引、双引互换会怎么样？四层嵌套是不是也遵守这个规则。。
js中的引号的嵌套（转）
djfiew7234的博客
10-13 107
在JavaScript中字符串是用引号“" "”、“' '”包起来的零个至多个字符。用哪个引号开始就用哪个结束，而且单双引号可嵌套使用，不过JavaScript中引号的嵌套只能有一层。如果想再多嵌一些，需要用转义字符： 转义字符由于一些字符在屏幕上不能显示，或者JavaScript语法上已经有了特殊用途，在要用这些字符时，就要使用“转义字符”。转义字符用斜杠“\”开头：\'...
JS 三层引号嵌套使用
旭东怪的博客
09-15 3225
1、第一层单引号，第二层双引号，第三层转义单引号 $("#test").html('<input type="button" value="按钮" onclick="alert(\'123a\')"/>'); 2、第一层双引号，第二层单引号，第三层转义双引号 $("#test").html("<input type='button' value='按钮' onclick='alert(\"123a\")'/>"); 注： （1）第三层转义引号要和第一层引号一致。例如，.
javascript中引号嵌套教程
猪逻辑公园
09-17 423
&lt;a href=" javascript:document.write(' &lt;a href=\'www.baidu.com\'&gt;baidu&lt;/a&gt; ') "&gt;a-href&lt;/a&gt;语句里面的所有引号，在可以使用转义字符的情况下，单引号和双引号之间可以怎样变化，有几种表示方法？像这样遇到引号嵌套应该怎么套，有规律吗？是不是一般在单引号里面套双引号？当拼接...
js引号的多层嵌套
肉团子的博客
02-16 430
<script type="text/javascript"> function delName(obj,divNum){ if(obj.length>8){ var creatDiv="<button type='button' style='background: transparent;' class='btn' onmouseover='document.getE
关于js的单双引号嵌套问题
dnvwjp3595的博客
08-18 289
单引号和双引号之间可以相互嵌套。 1、单引号内只能嵌套双引号。 2、双引号内只能嵌套单引号。 3、如果想在双引号内，再嵌套双引号，里面的双引号，一定要进行转义（\”）。 4、JS中的转义字符是反斜杠(\).常用的转义字符有：\’、\”、\\、\r、\n等。 转义字符也就是，当浏览器遇到反斜杠(\)时，将会对其后的一个字符进行特殊对待，当成一个一个普通字符来对待。所谓“普通”字符...
JS多级引号嵌套
Akony的博客
03-21 660
Vue自定义组件中 动态绑定class '&lt;ul :class="' + "'suggest-quizlist-ul suggest-quizlist-ul-'" + '+THEME" id="suggest-quizlist-ul" v-cloak&gt;' + '&lt;li class&gt;&lt;strong&gt;推荐测试题&lt;/strong&gt;&a
关于JS中多层嵌套引号
weixin_42018057的博客
08-01 4988
引号多层嵌套笔记 &quot;&amp;lt;el-menu-item index=\&quot;4-2\&quot; @click=\&quot;routerTo('light-alarm.html')\&quot;&amp;gt; {{ navText.mantainenceSubNavigation[1] }} &amp;lt;/el-menu-item&amp;gt;&quot; 此种情况下，最外层用“”双引号，里层
js正则表达式获取引号嵌套的内容
最新发布
06-08
获取引号嵌套的内容可以使用正则表达式中的捕获组，例如： ``` var str = 'He said, "Hello world!" and she said, "I\'m fine."'; var pattern = /(["'])(.*?)\1/g; var matches = str.match(pattern); console.log(matches); // ["Hello world!", "I'm fine."] ``` 这个正则表达式 `/(["'])(.*?)\1/g` 中，括号内的 `["']` 表示匹配单引号或双引号，`\1` 表示引用第一个捕获组中的内容（也就是匹配到的单引号或双引号），`.*?` 表示匹配任意字符，并且使用非贪婪模式。最后使用 `g` 修饰符表示全局匹配。执行 `str.match(pattern)` 会返回一个数组，里面包含匹配到的字符串。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值