Question

这可能是一个简单的答案，但出于某些原因，当我执行以下代码时

$(value).closest('a').find('i.glyphicon').removeClass('glyphicon-star-empty').addClass('glyphicon-star');

console.log(navigationButtonIcon);

// Append favourite item to favourites list
$("#favouritesList").append("<li><a id=" + favouriteLinkID + ">"+ navigationButtonIcon + favouriteValue + "</span><i class='glyphicon glyphicon-minus pull-right removeFavourite'></i></a></li>");

它在控制台日志中显示：

<i class="fa fa-dashboard fa-fw selectNavigationBTNIcon">::before</i>

并在我尝试将其显示为网页上的元素时显示：

[object HTMLElement]

我错误的是它没有将[object HTMLElement]显示为实际的代码行？

Answer 1

您将元素对象添加为字符串，并自动将其转换为[object HTMLElement]。您需要将作为元素或添加为HTML字符串。

作为HTML字符串（使用DOM .outerHTML获得）：

$("#favouritesList").append("<li><a id=" + favouriteLinkID + ">"+ navigationButtonIcon.outerHTML + favouriteValue + "</span><i class='glyphicon glyphicon-minus pull-right removeFavourite'></i></a></li>");

作为元素（使用jQuery .prepend()）：

$("#favouritesList").append("<li><a id=" + favouriteLinkID + ">"+ favouriteValue + "</span><i class='glyphicon glyphicon-minus pull-right removeFavourite'></i></a></li>").find('#'+favouriteLinkID).prepend(navigationButtonIcon);

在网页上渲染[object HTMLElement]作为元素

1 个答案: