html片段拼接

方法一：

function dialog1(title, msg, btn1, callback) {
    var dialog1;
    dialog1 = '  <div class="weui_dialog_confirm" id="dialog1" style="display: none;"> ' +
        ' <div class="weui-mask weui-mask--visible"></div>' +
        ' <div class="weui-dialog weui-dialog--visible"> ' +
        '  <div class="weui-dialog__hd"><strong class="weui-dialog__title">' + title + '</strong></div>' +
        ' <div class="weui-dialog__bd">' + msg + '</div>' +
        ' <div class="weui-dialog__ft"><a href="javascript:;" class="weui-dialog__btn primary"> ' + btn1 + ' </a></div>' +
        ' </div> ' +
        ' </div>';
}

方法二：

<sctipt>
    //追加报告表单
   $('.x_zs_btn button#x_btn').on('click',function(){
        var htmladd="";
        htmladd +='<div class="x_add_details mb20">';
        htmladd +='<input class="form-control mb20" type="text"  placeholder="请输入标题">';
        htmladd +=' <textarea name="" id="" rows="3" placeholder="请输入内容"></textarea>';
        htmladd +=' </div>';
        $(".x_addtable").append(htmladd);
        $('.x_zs_btn button#x_btn1').show()
    })
</script>

方法三：使用“”反斜杠拼接

 var lang = {
             url : 'http://www.dianziq.com',
             upload : 'ABCD',
             viewServer : 'viewServer',
             width : 100 ,
             height : 100
       } ,

 var html2 = '
            <div style="padding:20px;">
            <div class="ke-dialog-row">
            <label for="keUrl" style="60px;">' + lang.url + '</label>
            <input class="ke-input-text" type="text" id="keUrl" name="url" value="" style="160px;" /> &nbsp;
            <input type="button" class="ke-upload-button" value="' + lang.upload + '" /> &nbsp;
            <span class="ke-button-common ke-button-outer">
            <input type="button" class="ke-button-common ke-button" name="viewServer" value="' + lang.viewServer + '" />
            </span>
            </div>
            <div class="ke-dialog-row">
            <label for="keWidth" style="60px;">' + lang.width + '</label>
            <input type="text" id="keWidth" class="ke-input-text ke-input-number" name="width" value="550" maxlength="4" />
            </div>
            <div class="ke-dialog-row">
            <label for="keHeight" style="60px;">' + lang.height + '</label>
            <input type="text" id="keHeight" class="ke-input-text ke-input-number" name="height" value="400" maxlength="4" />
            </div>
            </div>
            ' ;

方法四：使用tab键盘上方的反引号拼接

$(".zppsList .item .right button").click(function () {
  layer.open({
    skin: 'alert-skin',//弹出层皮肤，可自定义也可用官方
    title: ['导出字段选择', 'color:rgb(139, 181, 219);'],//弹出层title,数组右半部份设置title样式
    area: 'auto',
    maxWidth: 800,
    // maxHeight:1000,
    btn: ['确认导出', '取消'],//设置底部按钮
    btn1: function () {
    },
    //content为弹出层内容
    content: `<div class="pupup"> 
<div class="img"><img src="../../../images/3.jpg" alt=""></div>
<div class="flex flex-center"><div id="star"></div></div>
</div>`
    , success: function () {
      layui.use(['element', 'rate'], function () {
        var element = layui.element,
          rate = layui.rate;

        rate.render({
          elem: '#star'
          , value: 3.5 //初始值
          , half: true //开启半星
          , text: true
        });

        element.init();
      });