使用JavaScript创建一个div，它也将成为主div的顶部

Question

这是我的HTML模板。

<div id='main'> 
    <div id='1'>one</div> 
</div> 

我想动态地创建一个新的div与主div的内部，并且它（new div>）将会到达主div的顶部。答案看起来很喜欢

<div id='main'> 
    <div id='new'>new</div> 
    <div id='1'>one</div> 
</div> 

这怎么能实现？

Answer 1

选择#main元素时，可以使用jQuery's .prepend() method。

$('#main').prepend('<div id="new">new</div>'); 

您应该注意，以数字开头的ID不是有效的HTML4。所以id="1"将无效。

将其更改为id="div_1"这样的有效标识，您可以选择该标识并使用jQuery's .before() method代替。

$('#div_1').before('<div id="new">new</div>'); 

而在这两种情况下，记得要包装你的jQuery这样的代码，以便它不运行，直到DOM已准备就绪。

$(function() { 
    $('#main').prepend('<div id="new">new</div>'); 
});