使用Javascript/jQuery來創建一個div - 簡單的方式

我有這樣的代碼在一個div：使用Javascript/jQuery來創建一個div - 簡單的方式

<div class="user_event my_background"> 
     <%= image_tag("events_pics/boom.png", :class=> 'event_pic_small') %> 
     <h6 class="event_info">Event_1: Frame: 974</h6> 
     <a class="btn btn-mini btn-danger pull-right " href="#"><i class="icon-remove"></i></a> 
    </div>

，我想這是我每次點擊一個按鈕附加到其他元素。無論如何，主要問題是，有沒有一種簡單的方法來創建上面的div使用JavaScript？例如一個函數將其作爲參數並創建它？由於

來源

2012-06-19 Test Test

使用該腳本：

$("body").prepend('<div>').addClass("user_event").addClass("my_background"); 
function addElement() 
{ 
    $(".user_event.my_background").append('<h6 class="event_info">Event_1: Frame: 974</h6>'); 
    $(".user_event.my_background").append('<a class="btn btn-mini btn-danger pull-right " href="#"><i class="icon-remove"></i></a>'); 
}

希望這有助於！ :)

來源

2012-06-19 09:50:18

如果你可以使用jQuery然後

$(".user_event").clone().appendTo("#MyTargetElement");

編輯：

而是一次又一次地創造的div，我建議你把它藏在了一些元素，使用該隱藏元素的ID獲取它並將其附加到您的目標元素。

<div id="myhiddenelement" style="display:none;"> 
<div class="user_event my_background"> 
     <%= image_tag("events_pics/boom.png", :class=> 'event_pic_small') %> 
     <h6 class="event_info">Event_1: Frame: 974</h6> 
     <a class="btn btn-mini btn-danger pull-right " href="#"><i class="icon-remove"></i></a> 
    </div> 
</div>

jQuery的

("#MyTargetElement").append($("#myhiddenelement").html());

來源

2012-06-19 09:50:58

這簡單的jQuery函數將設置選擇任何你想要的元素中的HTML。

$("SomeElement").html("<div class='user_event my_background'>...</div>")

只需指定要添加html的元素，然後將剩下的html作爲參數，然後就可以了。希望有所幫助。

來源

2012-06-19 09:51:03 Logard

你可能想檢查Jquery，你可以使用類名訪問div。

來源

2012-06-19 09:51:20 MACMAN

function append_to_what(id)//id can be any css3 selector 
{var div=document.createElement('div'); 
div.innerHTML='<%= image_tag("events_pics/boom.png", :class=> "event_pic_small") %><h6 class="event_info">Event_1: Frame: 974</h6><a class="btn btn-mini btn-danger pull-right " href="#"><i class="icon-remove"></i></a>'; 
' 
div.className='user_event my_background'; 
document.querySelector(id).appendChild(div); 
}

來源

2012-06-19 09:51:30

使用Javascript/jQuery來創建一個div - 簡單的方式

回答

相關問題