為什么javascript關閉頁面標簽？

Question

我有一個簡單的js，可根據供應商變量輸出html

if (icAnalytics == "1"){//Analytics
    $("#anal22").html("<a class='test1 test2 test33' href=/dashboard/site_sum.asp?id=application>Analytics</a>");
        };

if (icPermissions >= "1"){//Publishers
            $("#pub22").html("<a tabindex='0' href=/admin/default.asp class='ubermenu-target ubermenu-target-with-icon ubermenu-item-layout-default ubermenu-item-layout-icon_left'><i class='ubermenu-icon fa fa-lock'></i><span class='ubermenu-target-title ubermenu-target-text'>Pub</span></a>");
            }

if (icPermissions == "2"){//Admins
        $("#admin22").html("<a class=aTop2 href=/system/default.asp>Admin</a>");
        }

else {
 };

問題是當我將html轉換為“ li”時-即使我沒有將代碼添加到其中，它<li id="pub22">自動關閉“ li”。 我無法真正更改頁面的布局，因為我無權訪問它。 有沒有一種方法可以防止在從javascript插入html后關閉li？

注意-這有點復雜。 首先是pub22 li，然后將anal22和admin22嵌套並具有不同的權限。 由於它們是嵌套的，所以我想讓li打開。 也許我把這個變得太難了。

Answer 1

使用JavaScript將任何HTML添加到DOM后，Web瀏覽器將嘗試解析該HTML。 如果創建一個<li>元素而不關閉它，瀏覽器將類似於“哇，那不是有效的HTML；我會解決它”，它將自動關閉該標記。

但是，所有的希望並沒有失去！ 與其在編寫時將代碼添加到DOM中，不如將其全部存儲在一個字符串中，並且僅在完成后才將字符串添加到DOM中。

這是一個例子：

var myHtml = "<li>"
myHtml += "blah blah this is some content";
myHtml += "</li>";
$("#someElement").html(myHtml); //we add the html to the DOM only now that we're done writing it

Answer 2

您需要執行以下操作：

$element = $('<li id="pub22">...</li>');
$element.append('<a id="anal22" href="...">...</a>');
$element.append('<a id="admin22" href="...">...</a>');
$element.appendTo('#someContainerElement');

在這里，您可以創建<li> ，在其中添加一些<a>元素，然后最終將<li>附加到DOM中的某些現有元素。 以這種方式創建元素並在准備好將其激活時將它們附加到DOM是jQuery的主要功能之一（實際上，這是基本jQuery函數的一部分）。

Answer 3

jQuery的.html使用JavasScript的.innerHTML

.innerHTML將節點插入DOM。 根據定義，節點必須是有效的標記。 因此，瀏覽器正在即時糾正您的錯誤標記。