将id添加到动态创建的<div>

use*_*034 52 javascript jquery

我有以下JavaScript创建一个div,然后将其附加到正文,然后将一些动态生成的HTML插入其中.cartDiv = document.createElement('div'); 这个div我想添加一个id和/或一个类.如果可能,Jquery和JavaScript的答案都会很棒.

var cartHTML = '<div class="soft_add_wrapper" onmouseover="setTimer();">';
cartHTML += '<div class="soft_add_header_shadow">';
cartHTML += '<div class="soft_add_header"><span class="soft_add_span">Added to cart</span><a href="" class="close_btn" onclick="hideCart(); return false;">Close</a></div></div>'
cartHTML += '<div class="soft_add_content_shadow"><div class="soft_add_content_wrapper">';
cartHTML += '<div class="soft_add_content_area" onscroll="setTimer();"><table class="cart_table" cellpadding="0" cellspacing="0" border="0">';
if (cartLength != 0) {
    cartHTML += cartLoop(index, cartLength);
    if (index != 0) {
        cartHTML += cartLoop(0, index);
    }
    if (discountTotal != "0") {
        var discountProduct = {
        ProductName: "Discount(s)",
        ProductPrice: '<span style="color:red">' + discountTotal + '</span>'
        }
        cartHTML += getLineItemHTML(discountProduct);
    }
}
cartHTML += '</table></div><div class="soft_add_sub_total"><div class="number_of_items">' + quantity + ' items in cart</div>';
cartHTML += '<div class="sub_total">';
cartHTML += 'Subtotal: <span class="sub_total_amount">' + cartTotal + '</span>';
cartHTML += '</div>';
 cartHTML += '</div><div class="soft_add_action_area"><a href="/ShoppingCart.asp" class="check_out">Check Out</a>';
cartHTML += '<a href="" class="continue_shopping" onclick="hideCart(); return false;">Continue shopping</a></div></div></div></div>';
if (cartDiv == null) {
    cartDiv = document.createElement('div');
    document.body.appendChild(cartDiv);
}
cartDiv.innerHTML = cartHTML;
Run Code Online (Sandbox Code Playgroud)

Fel*_*ing 127

如果我找到你的话,就像那样容易

cartDiv.id = "someID";
Run Code Online (Sandbox Code Playgroud)

不需要jQuery.

看看DOM元素属性.

对于类,它是相同的:

cartDiv.className = "classes here";
Run Code Online (Sandbox Code Playgroud)

但请注意,这将覆盖现有的类名.如果要动态添加和删除类,则必须使用jQuery或编写自己的函数来执行某些字符串替换.

  • 更新:对于较新的 javascript 引擎,您可以使用新的 classList API 以获得更类似于 jQuery 的类体验:https://developer.mozilla.org/en-US/docs/Web/API/Element.classList (2认同)