js中的引号嵌套问题

最新推荐文章于 2024-09-20 11:14:28 发布
最新推荐文章于 2024-09-20 11:14:28 发布
阅读量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层嵌套已经可以解决绝大部分的应用场景了。

萧逸才
关注
专栏目录
关于JavaScript的单双引号嵌套问题
11-30
单引号和双引号之间可以相互嵌套。 1、单引号内只能嵌套双引号。 2、双引号内只能嵌套单引号。 3、如果想在双引号内，再嵌套双引号，里面的双引号，一定要进行转义（\”）。 4、JS中的转义字符是反斜杠(\).常用的转义字符有：\’、\”、\\、\r、\n等。 转义字符也就是，当浏览器遇到反斜杠(\)时，将会对其后的一个字符进行特殊对待，当成一个一个普通字符来对待。所谓“普通”字符就是a、b、c、&等。 总结 以上所述是小编给大家介绍的关于JavaScript的单双引号嵌套问题 ，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！
js的单双引号嵌套问题
Smile__Mo的博客
07-30 1522
单引号和双引号之间可以相互嵌套。 1、单引号内只能嵌套双引号。 2、双引号内只能嵌套单引号。 3、如果想在双引号内，再嵌套双引号，里面的双引号，一定要进行转义（\”）。 4、JS中的转义字符是反斜杠(\).常用的转义字符有：\'、\”、\\、\r、\n等。 转义字符也就是，当浏览器遇到反斜杠(\)时，将会对其后的一个字符进行特殊对待，当成一个一个普通字符来对待。所谓“普通”字符就是a、b...
深入理解JavaScript中的单双引号使用
最新发布
weixin_33363025的博客
09-20 1337
本文还有配套的精品资源，点击获取 简介：在JavaScript中，单引号和双引号都用于创建字符串，并且在大多数情况下可以互换使用。本主题详细探讨了单双引号的使用方法、如何处理字符串内部的引号嵌套、模板字符串的介绍、性能和编码差异、代码风格指南、自动闭合功能以及编码工具的使用。了解和掌握这些细节有助于编写更清晰、有效和可维护的JavaScript代码。 1. Jav...
JS中单引号和双引号嵌套传参的问题
XiaoBo_S的博客
02-23 2571
1、首先从本质上来说你在js或者jquery中使用单引号或者双引号是没有区别的，都可以成功被解析，但是关键在于有很多场景我们进行字符串拼接时会同时使用单引号和双引号这个时候要遵循一个原则：要成对嵌套使用，外层用单引号里面就用双引号，外层用双引号里面就用单引号 2、传参问题，如果你传递的参数仅仅是一个非字符型的变量的话按正常的写法不会有什么问题，但是我的一个需求如下， 我要在一段动态生成的h...
JavaScript中引号的嵌套
掬水月在手，弄花香满衣
03-15 161
在JavaScript中字符串是用引号“" "”、“' '”包起来的零个至多个字符。用哪个引号开始就用哪个结束，而且单双引号可嵌套使用，不过JavaScript 中引号的嵌套只能有一层。如果想再多嵌一些，需要用转义字符： 转义字符 由于一些字符在屏幕上不能显示，或者 JavaScript 语法上已经有了特殊用途，在要用这些字符时，就要使用“转义字符”。转义字符用斜杠“\”开头：\' 单引号、\"...
js中多层引号嵌套的处理方法
wuyanjing007的博客
11-30 2399
js中四层引号嵌套的处理方法 `<form style="padding:10px;width:335px;"> <div style="padding-top:5px;width:99%;"> <input style="width:99%" class="easyui-combotree" data-options=" onSelect: function (node) { $('[name=&quot;featureLayer&quot
JS 三层引号嵌套使用
旭东怪的博客
09-15 3293
1、第一层单引号，第二层双引号，第三层转义单引号 $("#test").html('<input type="button" value="按钮" onclick="alert(\'123a\')"/>'); 2、第一层双引号，第二层单引号，第三层转义双引号 $("#test").html("<input type='button' value='按钮' onclick='alert(\"123a\")'/>"); 注： （1）第三层转义引号要和第一层引号一致。例如，.
Java和JavaScript中的双引号嵌套问题
PixelDyno的博客
10-09 238
在Java和JavaScript编程中，双引号（"）是用来表示字符串文字的常见方式。本文将详细讨论如何在Java和JavaScript中处理双引号嵌套的问题，并提供相应的源代码示例。综上所述，无论是在Java还是JavaScript中，当需要在字符串文字中插入双引号时，我们可以使用转义字符或选择不同的引号类型来解决双引号嵌套的问题。在Java中，字符串文字可以使用双引号括起来。因此，要在字符串中插入双引号，需要使用反斜杠进行转义。在JavaScript中，字符串文字也可以使用双引号括起来，类似于Java。
我遇到的参数传递中 双引号单引号嵌套问题
09-05
参数传递中双引号单引号嵌套问题解决方案 在编程中，参数传递是非常常见的一种操作，但是当我们需要在双引号中嵌套单引号时，问题就来了。在这篇文章中，我们将讨论如何解决参数传递中双引号单引号嵌套问题。 首先...
javascript 复杂的嵌套环境中输出单引号和双引号
10-29
以下是一个例子，展示了如何在JavaScript中处理复杂的引号嵌套： ```javascript var str = '<a href="javascript:alert(\'这里有2个单引号一个双引号"\'' + "' :)";\">引号的嵌套</a>"; ``` 在这个例子中，`href`...
JavaScript中引号的多重嵌套
Wreck_It的专栏
03-24 8230
JavaScript的引号嵌套时单引号和双引号是交替使用的，但是到第三层就会出现解析错误如： '' 这种用情况下something前的单引号会成为整个字符串的结束，解决方式： ''转义单引号即可。 但是转义时不可用双引号： '' 这样的话解析时，something前的双引号会被作为href属性的结束。 所以转义时也必须交替进行。 另外也可以把引号用HTML代码来代替引号
javascript中引号嵌套教程
猪逻辑公园
09-17 441
&lt;a href=" javascript:document.write(' &lt;a href=\'www.baidu.com\'&gt;baidu&lt;/a&gt; ') "&gt;a-href&lt;/a&gt;语句里面的所有引号，在可以使用转义字符的情况下，单引号和双引号之间可以怎样变化，有几种表示方法？像这样遇到引号嵌套应该怎么套，有规律吗？是不是一般在单引号里面套双引号？当拼接...
js的引号多级嵌套
热门推荐
wei
11-20 1万+
在js中经常会写到引号的嵌套。1.比如alert("abc"); 就没有嵌套的引号而言，alert(abc);一样正常工作，即使"countryId=" + $(#destCountry).val()单双混用也不会有问题。2.再看引号里面嵌套引号的情况： $.each(data,function(i,n){ f += + n.text + ;
javascript中引号嵌套
闷骚的男
12-24 4003
a-href语句里面的所有引号，在可以使用转义字符的情况下，单引号和双引号之间可以怎样变化，有几种表示方法？像这样遇到引号嵌套应该怎么套，有规律吗？是不是一般在单引号里面套双引号？ 当拼接JS字符串的时候，双引号里面一定要是单引号，单引号里面要是双引号。如此循环！不过全部双引号也可以，就是双引号里面的双引号需要转义！ 单引号 双引号嵌套使用时，要注意以下几点就可以了： 1. 单（双）引号开始 单（双）引号结束，配对使用 2. 单引号在前，后面是双引号 3. 双引号在前，单引号在后 4. 单引号在
关于js的单双引号嵌套问题
dnvwjp3595的博客
08-18 302
单引号和双引号之间可以相互嵌套。 1、单引号内只能嵌套双引号。 2、双引号内只能嵌套单引号。 3、如果想在双引号内，再嵌套双引号，里面的双引号，一定要进行转义（\”）。 4、JS中的转义字符是反斜杠(\).常用的转义字符有：\’、\”、\\、\r、\n等。 转义字符也就是，当浏览器遇到反斜杠(\)时，将会对其后的一个字符进行特殊对待，当成一个一个普通字符来对待。所谓“普通”字符...
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、付费专栏及课程。

余额充值