js中的引号嵌套问题

作者：KING逊咖 | 来源：互联网 | 2023-10-12 18:59

<!DOCTYPEhtml><html><head><metacharsetutf-8><head&g


<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('
');
 $("#double_quotes").append("
");
 }

 function twoLayerNesting(){
 $("#single_quotes").append('
');
 $("#double_quotes").append("
");
 }

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

 $("#single_quotes").append('+value+'");" />');/*错误例子-2-显示错误:*/
 $("#double_quotes").append("+value+"');' />");/*错误例子-2-显示错误:*/

 $("#single_quotes").append('+value+'\");" />');/*错误例子-3-显示错误:*/
 $("#double_quotes").append("+value+"\');' />");/*错误例子-3-显示错误:*/

 $("#single_quotes").append('\");" />');/*错误例子-4-显示错误:*/
 $("#double_quotes").append("\,);' />");/*错误例子-4-显示错误:*/

 $("#single_quotes").append(''\');" />');/*正确例子-1*/
 $("#double_quotes").append("");/*正确例子-1*/

 $("#single_quotes").append('
');/*正确例子-2*/
 $("#double_quotes").append("
");/*正确例子-2*/
 }

 function fourLayerNesting(){
 $("#single_quotes").append('\');" />');/*错误例子-1-显示错误:*/
 $("#double_quotes").append("\");' />");/*错误例子-1-显示错误:*/

 //'是单引号的转义符，"是双引号的转义符
 $("#single_quotes").append('\');" />
');/*正确例子*/
 $("#double_quotes").append("
");/*正确例子*/
 }

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

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

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

- 单引号：' " \' " 单引号 " \' " '
- 双引号：" ' \" ' 双引号 ' \" ' "

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

推荐阅读

string
《数据结构》学习笔记3——串匹配算法性能评估

本文主要讨论串匹配算法的性能评估，包括模式匹配、字符种类数量、算法复杂度等内容。通过借助C++中的头文件和库，可以实现对串的匹配操作。其中蛮力算法的复杂度为O(m*n)，通过随机取出长度为m的子串作为模式P，在文本T中进行匹配，统计平均复杂度。对于成功和失败的匹配分别进行测试，分析其平均复杂度。详情请参考相关学习资源。 ... [详细]

蜡笔小新 2023-12-13 16:16:05
merge
C#之数据集：DataSet对象的使用及相关方法详解

本文介绍了C#中数据集DataSet对象的使用及相关方法详解，包括DataSet对象的概述、与数据关系对象的互联、Rows集合和Columns集合的组成，以及DataSet对象常用的方法之一——Merge方法的使用。通过本文的阅读，读者可以了解到DataSet对象在C#中的重要性和使用方法。 ... [详细]

蜡笔小新 2023-12-14 12:09:13
input
猜字母游戏

猜字母游戏猜字母游戏——设计数据结构猜字母游戏——设计程序结构猜字母游戏——实现字母生成方法猜字母游戏——实现字母检测方法猜字母游戏——实现主方法1猜字母游戏——设计数据结构1.1 ... [详细]

蜡笔小新 2023-12-13 12:04:03
input
南邮ctf-web的writeup

本文介绍了南邮ctf-web的writeup，包括签到题和md5 collision。在CTF比赛和渗透测试中，可以通过查看源代码、代码注释、页面隐藏元素、超链接和HTTP响应头部来寻找flag或提示信息。利用PHP弱类型，可以发现md5('QNKCDZO')='0e830400451993494058024219903391'和md5('240610708')='0e462097431906509019562988736854'。 ... [详细]

蜡笔小新 2023-12-13 10:58:55
perl
Android 新闻App的本地服务器搭建教程

本文介绍了在开发Android新闻App时，搭建本地服务器的步骤。通过使用XAMPP软件，可以一键式搭建起开发环境，包括Apache、MySQL、PHP、PERL。在本地服务器上新建数据库和表，并设置相应的属性。最后，给出了创建new表的SQL语句。这个教程适合初学者参考。 ... [详细]

蜡笔小新 2023-12-14 17:15:19
string
Java实现大数乘法（分治算法）

本文介绍了使用Java实现大数乘法的分治算法，包括输入数据的处理、普通大数乘法的结果和Karatsuba大数乘法的结果。通过改变long类型可以适应不同范围的大数乘法计算。 ... [详细]

蜡笔小新 2023-12-14 15:43:50
string
java 线程死锁模拟

1，关于死锁的理解死锁，我们可以简单的理解为是两个线程同时使用同一资源，两个线程又得不到相应的资源而造成永无相互等待的情况。 2，模拟死锁背景介绍：我们创建一个朋友 ... [详细]

蜡笔小新 2023-12-13 19:12:25
string
动态规划算法的基本步骤及最长递增子序列问题详解

本文详细介绍了动态规划算法的基本步骤，包括划分阶段、选择状态、决策和状态转移方程，并以最长递增子序列问题为例进行了详细解析。动态规划算法的有效性依赖于问题本身所具有的最优子结构性质和子问题重叠性质。通过将子问题的解保存在一个表中，在以后尽可能多地利用这些子问题的解，从而提高算法的效率。 ... [详细]

蜡笔小新 2023-12-13 15:38:19
char
高质量SQL书写的30条建议

本文提供了30条关于优化SQL的建议，包括避免使用select *，使用具体字段，以及使用limit 1等。这些建议是基于实际开发经验总结出来的，旨在帮助读者优化SQL查询。 ... [详细]

蜡笔小新 2023-12-13 13:24:33
input
[大整数乘法] java代码实现

本文介绍了使用java代码实现大整数乘法的过程，同时也涉及到大整数加法和大整数减法的计算方法。通过分治算法来提高计算效率，并对算法的时间复杂度进行了研究。详细代码实现请参考文章链接。 ... [详细]

蜡笔小新 2023-12-13 11:21:32
input
深入理解CSS中的margin属性及其应用场景

本文主要介绍了CSS中的margin属性及其应用场景，包括垂直外边距合并、padding的使用时机、行内替换元素与费替换元素的区别、margin的基线、盒子的物理大小、显示大小、逻辑大小等知识点。通过深入理解这些概念，读者可以更好地掌握margin的用法和原理。同时，文中提供了一些相关的文档和规范供读者参考。 ... [详细]

蜡笔小新 2023-12-12 18:01:10
testing
单击时动态创建
元素 - Dynamically create
element on click

Ihavethefollowingonhtml我在html上有以下内容<html><head><scriptsrc..3003_Tes ... [详细]

蜡笔小新 2023-12-12 15:59:36
input
hdu4888 Redraw Beautiful Drawings

本文介绍了一道网络流题目hdu4888 Redraw Beautiful Drawings的解题思路。题目要求以行和列作为结点建图，并通过最大流算法判断是否有解以及是否唯一。文章详细介绍了建图和算法的过程，并强调在dfs过程中要进行回溯。 ... [详细]

蜡笔小新 2023-12-12 11:54:35
input
如何在有序字符序列中插入新字符并保持有序

本文介绍了如何在给定的有序字符序列中插入新字符，并保持序列的有序性。通过示例代码演示了插入过程，以及插入后的字符序列。 ... [详细]

蜡笔小新 2023-12-14 11:16:33
string
关于cuowu类的错误提示和使用AdjustmentListener的问题

本文讨论了一个关于cuowu类的问题，作者在使用cuowu类时遇到了错误提示和使用AdjustmentListener的问题。文章提供了16个解决方案，并给出了两个可能导致错误的原因。 ... [详细]

蜡笔小新 2023-12-13 22:09:56

KING逊咖

这个家伙很懒，什么也没留下！

Tags | 热门标签

RankList | 热门文章