JS-创建多行字符串

最新推荐文章于 2022-12-21 12:43:49 发布

anleng6817

最新推荐文章于 2022-12-21 12:43:49 发布

阅读量441

点赞数

文章标签： php javascript ViewUI

原文链接：http://www.cnblogs.com/jffun-blog/p/9006710.html

版权

很多时候我们要创建很长的字符串，如比如动态添加HTML的时候。PHP中我们可以用

nowdoc（单引号）定界符字符串：不识别变量，不识别转义字符（除了\'和\\，分别代表单引号和反斜线）
heredoc（双引号）定界符字符串：识别变量，识别转义字符

来创建多行字符串。但JS中要怎么做呢？

一：直接用加号连接

var ts = '<!DOCTYPE html>'+
'<html lang="en">'+
'<head>'+
'  <meta charset="UTF-8">'+
'  <title>Document</title>'+
'</head>'+
'<body>'+
'  hello world'+
'</body>'+
'</html>'

二、使用反斜线（续行符）

var ts = '<!DOCTYPE html>\
<html lang="en">\
<head>\
  <meta charset="UTF-8">\
  <title>Document</title>\
</head>\
<body>\
  hello world\
</body>\
</html>'

三、字符串数组join

var ts = ['<!DOCTYPE html>',
'<html lang="en">',
'<head>',
'  <meta charset="UTF-8">',
'  <title>Document</title>',
'</head>',
'<body>',
'  hello world',
'</body>',
'</html>'].join('\n')

四、String.prototype.concat

var ts = String.prototype.concat.call('<!DOCTYPE html>',
'<html lang="en">',
'<head>',
'  <meta charset="UTF-8">',
'  <title>Document</title>',
'</head>',
'<body>',
'  hello world',
'</body>',
'</html>')

五、Function.prototype.toString()

==注意：这种方法要保证JS不被压缩掉注释，并且要注意去掉注释号时别去掉文本了。==

var ts = (function(){/*
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  hello world
</body>
</html>
*/}).toString().split('\n').slice(1,-1).join('\n') + '\n'

可以封装成方法：

function doc(fn) {
  return fn.toString().split('\n').slice(1,-1).join('\n') + '\n'
}
var ts = doc(function(){/*
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  hello world
</body>
</html>
*/})

六、CoffeeScript

要编译才能得到JS文件

ts = """
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  hello world
</body>
</html>
"""

七、模板字符串(ES6新特性)

==符IE不支持！！！是反引号"`"而不是单引号"'"==
模板字符串 - JavaScript | MDN

var ts = `<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  hello world
</body>
</html>`

转载于:https://www.cnblogs.com/jffun-blog/p/9006710.html

anleng6817

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS-创建多行字符串

很多时候我们要创建很长的字符串，如比如动态添加HTML的时候。PHP中我们可以用nowdoc（单引号）定界符字符串：不识别变量，不识别转义字符（除了\'和\\，分别代表单引号和反斜线）heredoc（双引号）定界符字符串：识别变量，识别转义字符来创建多行字符串。但JS中要怎么做呢？一：直接用加号连接var ts = '<!DOCTYPE html>'+'&lt...
复制链接

扫一扫