很多时候我们要创建很长的字符串,如比如动态添加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>`