天天都有新發現——如何優雅的用js動態添加html代碼

###如何優雅的用js動態的添加html代碼 >[原文](http://segmentfault.com/q/1010000000312781&sa=U&ei=r2deU9qOGM6iyAS79YHIDg&ved=0CGMQFjAK&usg=AFQjC)感謝Tychio提供的答案。 ###三種方案： 1.使用DOM     //使用createElement建立元素     var dialog = document.createElement('div');     var img = document.createElement('img');     var btn = document.createElement('input');     var content = document.createElement('span');     // 添加class     dialog.className = 'dialog';     // 屬性     img.src = 'close.gif';     // 樣式     btn.style.paddingRight = '10px';     // 文本     span.innerHTML = '您真的要GG嗎？';     // 在容器元素中放入其餘元素     dialog.appendChild(img);     dialog.appendChild(btn);     dialog.appendChild(span);      >關於添加class若是不考慮IE兼容性問題，可使用classList方法，詳細[API在這裏](https://developer.mozilla.org/en-US/docs/Web/API/Element/classList)。還有不少方法     用於DOM操做，在[這裏](http://www.w3school.com.cn/htmldom/dom_methods.asp)。 2.使用HTML5 template標籤