Javascript 动态dom未正确追加

我试图在dom中添加我的小模板，但是缺少一些元素，我不知道如果有人能纠正我的错误，为什么它不能动态地显示这些元素，而不是显示这个完整的模板，那么它的行为会很尴尬

以下是我的jquery代码：-

template = '<article id="ProfileBox" class="col-lg-3 ltr">' + 
                       '<div id="ProfileImage" class="Profile_image colored_border">' +
                       '<img src="../images/about-me/' + ParsingJsonData.UserImageUrl + '" class="Rounded-Corners" width="220" height="162">' +
                       '</div>' +
                       '<div id="ProfileContact">' +
                       '<h5 style="text-align: center;">' + ParsingJsonData.UserName + '</h5>' +
                       '<p style="text-align: center;"><strong>Role&nbsp;:&nbsp;</strong><em>' + ParsingJsonData.UserRole + '</em></p>' +
                       '<p style="text-align: center;"><i class="fa fa-mobile FontThemeColor" style="font-size: 15px;"></i>&nbsp; &nbsp;' + ParsingJsonData.UserCellNumber + '</p>' +
                       '<p style="text-align: center;"><i class="fa fa-envelope FontThemeColor" style="font-size: 10px;"></i>&nbsp;' + ParsingJsonData.UserEmailAdress + '</p>' +
                       '</div>' +
                       '</article>' +
                       '<article id="ProfileBox1" class="col-lg-9 ltr">' +
                       '<h3 class="HeadingThemeColor">Describing My Self !</h3>' +
                       '<div class="Profile_divider"></div>' +
                       '<p>' +
                             ParsingJsonData.UserDescription
                       '</p>' +
                       '<div class="Profile_list list-check">' +
                       '<ul id="ProfileCompleteInformation">' +
                           '<li>wajih</li>' +
                       '</ul></div>' +
                       '</article>';
$("#profileID").append(template);

template=''+
'' +
'' +
'' +
'' +
''+ParsingJsonData.UserName+''+
“
角色：”+ParsingJsonData.UserRole+”
”+
“
”+ParsingJsonData.UserCellNumber+”
'+
“
”+ParsingJsonData.userEmailAddress+”
”+
'' +
'' +
'' +
“描述我自己！”+
'' +
“”+
ParsingJsonData.UserDescription
“
”+
'' +
“
”+
“瓦吉”+
“
”+
'';
$（“#profileID”）.append（模板）；

追加后不显示元素：-

'<div class="Profile_list list-check">' +
                           '<ul id="ProfileCompleteInformation">' +
                               '<li>wajih</li>' +
                           '</ul></div>' +

“”+
“
”+
“瓦吉”+
“
”+

您在

ParsingJsonData.UserDescription

和

之间缺少一个连接运算符。如果正确缩进代码，阅读代码和避免这些错误会更容易。我可以建议你改用下面的方法吗（它也更有效）

var模板=[
'',
'',
'',
''
//...   
].加入（“”）；

如果您在JS中生成了很多标记，也许您应该看看一些模板库。
带有
id=“profileID”
的元素在哪里可能是
ParsingJsonData中的数据。UserDescription
中有一个单引号或双引号。嗯，好的，让我检查一下@MikeW@MikeW即使有，那也不是问题。
var template = [
    '<article id="ProfileBox" class="col-lg-3 ltr">',
        '<div id="ProfileImage" class="Profile_image colored_border">',
            '<img src="../images/about-me/', ParsingJsonData.UserImageUrl, 
                '" class="Rounded-Corners" width="220" height="162">',
        '</div>'
    //...   
].join('');