Javascript 为什么这个代码没有输出预期的结果？

我有以下jQuery，它构建嵌套的DOM元素并将其附加到当前DOM中。但是在结果中，元素没有很好地嵌套，并且输出在视觉上有点不好

consturlhash=“example”；
$（“#我的书签”）。附加(
$（“”，{'class'：'书签列表组项col-lg-3 col-md-4 col-sm-6 col-xs-12 clearfix'，'draggable'：'true'）。追加(
$（“”，{class'：“”}）。追加(
$（“”，{'class'：'col-xs-9 col-sm-9 col-md-7'，'id'：urlHash}）。追加(
$（“”，{'href'：linkURL，'id'：urlHash，'draggable'：'false'）。追加(
t） ）。附加(
$（“”，{'class'：'text right col-xs-3 col-sm-3 col-md-5'）。追加(
$（“”，{'class'：'btn btn默认字形图标字形图标铅笔编辑'}））.append(
$（“”，{'class'：'btn btn危险图示符图标图示符图标删除'}））
)
)
)

---

我会这样做，而不是一个长的附加链

const urlHash = "example";
const linkURL = "https://amazon.com";

var emptyCLassDiv = appendAndGetElement($("#myBookmarks"), 'div', {
    'class': 'bookmark list-group-item col-lg-3 col-md-4 col-sm-6 col-xs-12 clearfix',
    'draggable': 'true'});

var firstDivChild = appendAndGetElement(emptyCLassDiv, 'div', {
    'class': 'col-xs-9 col-sm-9 col-md-7',
    'id': urlHash
});

appendAndGetElement(firstDivChild, 'a', {
   'href': linkURL,'id': urlHash,'text': 'Amazon','draggable': 'false'
});

var secondDivChild = appendAndGetElement(emptyCLassDiv, 'div', {
   'class': 'text-right col-xs-3 col-sm-3 col-md-5'
});

appendAndGetElement(secondDivChild, 'a', {
  'class': 'btn btn-default glyphicon glyphicon-pencil edit',
  'role': 'button',
  'title': 'Edit Bookmark',
  'href': '#',
  'draggable': 'false'
});

appendAndGetElement(secondDivChild, 'button', {
   'class': 'btn btn-danger glyphicon glyphicon-remove delete',
   'title': 'Delete Bookmark'
});

function appendAndGetElement($parentEle, eleType, attr) {
   var newEle = $('<' + eleType + '/>', attr);
  $parentEle.append(newEle);
  return newEle;
}

consturlhash=“example”；
常量链接URL=”https://amazon.com";
var emptyCLassDiv=appendAndGetElement（$（“#myBookmarks”），“div”{
“类”：“书签列表组项col-lg-3 col-md-4 col-sm-6 col-xs-12 clearfix”，
'draggable'：'true'}）；
var firstDivChild=appendAndGetElement（emptyCLassDiv，'div'{
“类”：“col-xs-9 col-sm-9 col-md-7”，
“id”：urlHash
});
appendAndGetElement（firstDivChild，'a'{
'href'：linkURL，'id'：urlHash，'text'：'Amazon'，'draggable'：'false'
});
var secondDivChild=appendAndGetElement（emptyCLassDiv，'div'{
'class'：'text right col-xs-3 col-sm-3 col-md-5'
});
appendAndGetElement（secondDivChild，'a'{
“类”：“btn btn默认字形图标字形图标铅笔编辑”，
'角色'：'按钮'，
“标题”：“编辑书签”，
“href”：“#”，
'draggable'：'false'
});
appendAndGetElement（secondDivChild，'button'{
'类别'：'btn btn危险图示符图示符图示符图示符删除'，
“标题”：“删除书签”
});
函数appendAndGetElement（$parentEle、eleType、attr）{
var newEle=$（''，attr）；
$parentEle.append（newEle）；
返回newEle；
}

但是如果您绝对需要原始的长附加链解决方案。

---

下面是一个创建所需HTML的方法。

那么问题出在哪里？你似乎忘了告诉我们问题是什么。我没有拿出显微镜，但你的代码似乎创建了这种结构或类似的东西…？我在这里没有看到任何问题。除了代码中为div提供ID“example”之类的次要细节，但在预期代码的示例中没有。或者不显示class=''，而是显示class。我添加了实际的输出。嵌套有点不对劲，但我已经检查了一个多小时，看看是否有什么东西不对劲，代码对我来说似乎是正确的。试图阅读代码会让我的大脑受伤！