标签：lin 图片 switch append ESS class sina ide end
打开浏览器控制台：
var js = window.document.createElement(‘script‘); js.setAttribute(‘src‘, ‘https://lib.sinaapp.com/js/jquery/2.0.3/jquery-2.0.3.min.js‘); js.onload = function() { $(‘#item1‘).html(‘test html‘) }; window.document.head.appendChild(js);
.
js message()
var appendHTML=function(el, html){ var divTemp = document.createElement("div"), nodes = null // 文档片段，一次性append，提高性能 , fragment = document.createDocumentFragment(); divTemp.innerHTML = html; nodes = divTemp.childNodes; for (var i=0, length=nodes.length; i<length; i+=1) { fragment.appendChild(nodes[i].cloneNode(true)); } el.appendChild(fragment); // 据说下面这样子世界会更清净 nodes = null; fragment = null; }; function showMessage(message,type,time) { let str = ‘‘ switch (type) { case ‘success‘: str = ‘<div class="success-message animation" style="opacity:0;width: 300px;height: 40px;text-align: center;background-color:#daf5eb;;color: rgba(59,128,58,0.7);position: fixed;left: 50%;top: 30%;transform:translate(-50%,-50%);line-height: 40px;border-radius: 5px;z-index: 9999">\n‘ + ‘ <span class="mes-text">‘+message+‘</span></div>‘ break; case ‘error‘: str = ‘<div class="error-message animation" style="opacity:0;width: 300px;height: 40px;text-align: center;background-color: #f5f0e5;color: rgba(238,99,99,0.8);position: fixed;left: 50%;top: 30%;transform:translate(-50%,-50%);line-height: 40px;border-radius: 5px;;z-index: 9999">\n‘ + ‘ <span class="mes-text">‘+message+‘</span></div>‘ } str=‘<style>.animation{animation:mymove 3s forwards ;-webkit-animation:mymove 3s forwards;}@keyframes mymove{0%{opacity:0;}50%{opacity:1;}100%{opacity:0;}}@-webkit-keyframes mymove{0%{opacity:1;}50%{opacity:0.5;}100%{opacity:0;}}</style>‘+str; appendHTML( document.querySelector(‘body‘) , str ); setTimeout(function () { document.querySelector(‘body‘).removeChild(document.querySelector(‘.‘+type+‘-message‘)); },time) } showMessage(‘添加成功‘,‘success‘,2000)
标签：lin 图片 switch append ESS class sina ide end
原文地址：https://www.cnblogs.com/xiangsj/p/13305102.html
