function createStyle(){
return"*{padding:0;margin:0;border:0}.loading{width:640px;height:1024px;margin:0 auto}.loadImg{width:640px;height:1024px;animation:fadeInOut 3s linear;-webkit-animation:fadeInOut 3s linear;-moz-animation:fadeInOut 3s linear;opacity:0}@keyframes fadeInOut{0%{opacity:0}25%{opacity:.5}45%{opacity:1}50%{opacity:1}55%{opacity:1}75%{opacity:.5}100%{opacity:0}}@-moz-keyframes fadeInOut{0%{opacity:0}25%{opacity:.5}45%{opacity:1}50%{opacity:1}55%{opacity:1}75%{opacity:.5}100%{opacity:0}}@-webkit-keyframes fadeInOut{0%{opacity:0}25%{opacity:.5}45%{opacity:1}50%{opacity:1}55%{opacity:1}75%{opacity:.5}100%{opacity:0}}"
}
function addStyle(){
var style = document.createElement("style");
style.type = "text/css";
style.innerHTML = createStyle();
window.document.head.appendChild(style);
}
function addDom(){
var div = document.createElement("div");
div.className = "loading";
window.document.body.appendChild(div);
var img = document.createElement("img");
img.src="img/bg.png";
img.id="loadImg";
img.className="loadImg";
div.appendChild(img);
}
window.onload=function(){
addStyle();
addDom();
}

通过原生js添加div和css的更多相关文章

  1. 原生js添加和删除类

    原生js添加和删除类: this.className +=" "; this.className = this.className.replace(" 原来的类" ...

  2. 原生JS添加节点方法与jQuery添加节点方法的比较及总结

    一.首先构建一个简单布局,来供下边讲解使用 1.HTML部分代码: <div id="div1">div1</div> <div id="d ...

  3. 原生js添加博客点击鼠标出小心心效果~~

    昨天刚申请成功JS权限,心血来潮想添加点东西,记得之前看到别人家博客首页点击鼠标的时候会出现炫酷的 “小心心”,自己也来搞一个.没有用jquery啥的框架,原生js写起来麻烦了点,不过主要是怕博客首页 ...

  4. 原生js用div实现简单的轮播图

    文章地址 https://www.cnblogs.com/sandraryan/ 原生js实现轮播图. 打开页面图片自动轮播,点击prev next按钮切换到上/下一张图片,点击1-5切换到对应图片. ...

  5. 原生JS添加类名 删除类名

    为 <div> 元素添加 class: document.getElementById("myDIV").classList.add("mystyle&quo ...

  6. JS添加DOM元素CSS权重BUG

    修改删除table的时候,比如拆分合并单元格,合并全部TR中的某个TD后在拆分还原,即使直接在td标签中设置了td的高宽属性,当td在css文件中设置为宽度auto的时候,不能显示出TD来,显示TD宽 ...

  7. 原生js添加类名,删除类名

    1.添加类名: document.getElementById("myDiv").classList.add('mystyle'); 2.删除类名: document.getEle ...

  8. 使用原生JS 修改 DIV 属性

    本例参考并改进自:https://www.jianshu.com/p/2961d9c317a3 大家可以一起学习!! <!DOCTYPE html> <html lang=" ...

  9. 原生JS添加事件方法

    事件 事件添加方式 EvenTarget.addEventListener(EvenName, functionName, option); EventName: example => clic ...

随机推荐

  1. 重构第2天:方法搬移(Move Method)

    现在就重构来说是非常普通的,虽然我们经常会漏掉或忽略一些需要重构的地方.方法搬移,正如所定义的那样,把方法搬移到更适合他的位置.让我们看看下面这一段重构前的代码: 理解:方法搬移,正如所定义的那样,把 ...

  2. Python Shell 解释器下使用Django Model

    sys.path.append('E:/Projects/DjangoProjects/myFirstSite') os.environ.setdefault('DJANGO_SETTINGS_MOD ...

  3. 【Thinking in Java-CHAPTER 3】操作符

    优先级 赋值 对象在使用c=d,那么c和d都指向原本只有d指向的那个对象. 方法调用中的别名问题:当一个对象作为参数传递到一个函数中,函数改变了这个参数,则改变了传递进来的对象: 自增和自减 浮点型的 ...

  4. how to create a framework for ios . cool!

    预热. http://www.raywenderlich.com/65964/create-a-framework-for-ios http://insert.io/framework-ios8-xc ...

  5. linux常用

    一.命令 1.查指令,man, info, /usr/share/doc/: 2.文档,nano lyp.txt: 3.谁在线,who: 4.数据同步写入硬盘,sync: 5.显示档案,ls: 6.目 ...

  6. nodejs中常用加密算法

    在常用的nodejs+express工程中,为了安全在登录及表单传输时,应该都需进行加密传输,目前个人常用到的加密方式有下列几种: 1.Hash算法加密: 创建一个nodejs文件hash.js,输入 ...

  7. 设计前沿:25款精妙的 iOS 应用程序图标

    在这篇文章中,我为大家精心挑选的25款巧妙设计的 iOS 应用程序图标,会激发你未来的工作.苹果的产品总是让人爱不释手,设计精美,对用户使用体验把握得淋漓尽致,iPhone.iPad.iPod和 iM ...

  8. iOS-NSDate

    一.概念解释 1.什么是NSTimeZone? NSTimeZone:时区是一个地理名字,是为了克服各个地区或者国家之间在时间上的混乱设定的. 1).GMT:0:00格林威治标准时间:UTC +00: ...

  9. R提高篇(二): 图形初阶

    目录: 图形示例 图形参数 符号.线条 颜色 文本属性 尺寸与边界 自定义标题 自定义坐标轴 图例 文本标注 图形组合 图形示例 如下代码描述病人对两种药物五个剂量水平上的响应情况 > myda ...

  10. IOS开发UI基础UITextView相关属性

    UITextView相关属性 •    text: 设置textView中文本_textView.text = @"Now is the time for all good develope ...