如何将元素追加到正文？

Question

即时通讯目前使用下面的代码追加一个div机体：

$("body").append('<div class="tooltip" id="op" style="position: absolute; z-index: 999; height: 16px; width: 16px; top:70px"><span>Test</span></div>'); 

我怎么能这样做上述相同，但没有使用jQuery？

Answer 1

在纯JavaScript这将是多一点点冗长：

var div = document.createElement('div'); 
 
div.className = 'tooltip'; 
 
div.id = 'op'; 
 
div.style.cssText = 'position: absolute; z-index: 999; height: 16px; width: 16px; top:70px'; 
 
div.innerHTML = '<span>Test</span>'; 
 

 
document.body.appendChild(div);

Answer 2

你可以用DOM做很多事情！你可以这样操纵简单的html！

退房的W3网站： http://www.w3schools.com/js/js_htmldom.asp

Answer 3

我真的很喜欢insertAdjacentHTML方法为所有现代浏览器 - 并且还支持旧版浏览器。

参考：http://updates.html5rocks.com/2011/08/insertAdjacentHTML-Everywhere

用法：

var html = '<div class="tooltip" id="op" style="position: absolute; z-index: 999; height: 16px; width: 16px; top:70px"><span>Test</span></div>'; 
document.body.insertAdjacentHTML('beforeend', html);