使用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 - 简单的方式

回答

相关问题