项目场景:
js常用拼接DOM写法
这里写一个点击按钮生成DOM元素的场景代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
</head>
<body>
<button id="btn">点击生成按钮</button>
</body>
<script>
$("#btn").click(function () {
var b = 'strParams';
//初级
//普通拼接
var btn = "<button title='"+b+"'>" + b + "</button>";//生成strParams按钮
$("body").append(btn);
//反引号``(模板字符串)拼接
var btn2 = `<button title='${b}'>${b}</button>`;//生成strParams按钮
$("body").append(btn2);
})
</script>
</script>
</html>
渲染如下图