- 博客(24)
- 收藏
- 关注
转载 获取非行间样式的获取
当我们的样式写在行间的时候,JS可以通过style获取,然而style也只能获取或操作行间样式,当我们需要获取非行间的样式时,应该采用什么方法呢? 首先定义一个div并为他设置样式: <style> #div1{width:100px;height:100px;border:1px solid red;}</style>...
2018-10-10 17:03:00 123
转载 JS---arguments不定参
我们一般称使用arguments为可变参或不定参,采用arguments的函数其参数个数是可变的。arguments本质是一个数组,数组内存储的内容就是我们传入的的参数举个例子://写一个累加求和的函数function sum(){ var result=0; for(var i=0;i<arguments.length;i+...
2018-10-10 16:20:00 221
转载 JS继承
继承:是类与类之间的一种关系,js中没有类,通过构造函数来模拟类首先定义一个“人”类function Person(name,age){ this.name=name; this.age=age; } //使用原型可以实现数据共享 Person.prototype.eat=function(){ co...
2018-10-10 14:51:00 96
转载 解析原型链
首先,创建一个构造函数:function Person(name,age){ this.name=name; this.age=age; this.eat=function(){ console.log("吃"); } }接着,我们实例化两个对象: ...
2018-10-09 16:26:00 108
转载 JS三种创建对象的方式及工厂模式
首先,JS是一门基于对象的语言,不是面向对象语言,因为他的语法中没有Class(类) JS虽然不是面向对象的语言,但是可以模拟面向对象语言的编程思想1.通过new的方式(系统对象) var obj=new Object(); var arr=new Array(); var str=new String();2.字面...
2018-10-09 11:36:00 87
转载 封装getByClass
通过class获取元素,兼容IE678并进行了优化function getByClass(oParent,sClass){ if(oParent.getElementsByClassName){//判断是否支持getElementsByClassName() return oParent.getElementsByClassName(sClass)...
2018-08-21 15:52:00 87
转载 浮动
1.为什么浮动? 默认块级元素是独占一行的,而浮动就是让块级元素共处一行;那么为什么不设置成行内块级元素呢,因为它会有空隙。 浮动 行内快 行内元素浮动起来就会自动变成块元素; float:left/right2.清除浮动 为什么要清除浮动呢?在未给父元素设置固定高度的时候,浮动元素使其父元素高度塌陷;假设给父...
2018-08-16 15:07:00 89
转载 弹性盒子
一.弹性盒子介绍弹性盒子是 CSS3 的一种新的布局模式。引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间。● 伸缩容器:设置为display:flex或display:inline-flex的元素称为伸缩容器。● 伸缩项目:伸缩容器的子元素称为伸缩项目注意:设为Flex布局以后,子元素的float、clear和verti...
2018-08-11 22:57:00 106
转载 css3动画
什么是css3动画?动画是使元素从一种样式逐渐变化为另一种样式的效果。您可以改变任意多的样式任意多的次数。请用百分比来规定变化发生的时间,或用关键词 "from" 和 "to",等同于 0% 和 100%。0% 是动画的开始,100% 是动画的完成。为了得到最佳的浏览器支持,您应该始终定义 0% 和 100% 选择器。浏览器兼容:1)Internet Expl...
2018-08-10 16:42:00 83
转载 css3过渡
CSS3 过渡是元素从一种样式逐渐改变为另一种的效果。浏览器兼容性:Internet Explorer 10、Firefox、Chrome 以及 Opera 支持 transition 属性。Safari 需要前缀 -webkit-。注释:Internet Explorer 9 以及更早的版本,不支持 transition 属性。注释:Chrome 25 以及更早的版...
2018-08-08 23:04:00 157
转载 2D转换、3D转换
转换是使元素改变形状、尺寸和位置的一种效果。能够对元素进行移动、缩放、转动、拉长或拉伸。2D转换浏览器兼容:1)Internet Explorer 10、Firefox 以及 Opera 支持 transform 属性。2)Chrome 和 Safari 需要前缀 -webkit-。3)Internet Explorer 9 需要前缀 -ms-转换属性:tr...
2018-08-08 22:46:00 313
转载 css3线性渐变、径向渐变
线性渐变:div{ width:400px; height:100px; border:1px solid red; margin-left: 20px; /*参数:方向,开始渐变颜色,结束的渐变颜色*/ /*background-image:linea...
2018-08-07 16:27:00 88
转载 css3背景
浏览器支持情况:nternet Explorer 9+、Firefox、Chrome、Safari 以及 Opera 支持新的背景属性。demo:/*设置图片从哪开始显示*/ /*background-origin: border-box;图片是从边框左上角显示*/ /*background-origin: padding-box;图片从内边距的位...
2018-08-07 15:53:00 62
转载 css3边框,文本
css3边框属性:border-radius圆角 (浏览器:Internet Explorer 9+ 、Firefox、Chrome 以及 Safari )box-shadow盒阴影 (浏览器:Internet Explorer 9+ 、Firefox、Chrome 以及 Safari )border-image边框背景(浏览器:Firefox、Chrome、Safari...
2018-08-07 15:47:00 84
转载 canvas
canvas绘图过程:/*要有画布:canvas标签:宽和高是不能通过css3来设置,宽和高不能有px*创建绘图的对象*开始的位置*结束的位置*画*/canvas 元素本身是没有绘图能力的。所有的绘制工作必须在 JavaScript 内部完成:<canvas width="800" height="600"></canvas> ...
2018-08-04 14:37:00 99
转载 HTML本地存储
HTML5 提供了两种在客户端存储数据的新方法:localStorage - 没有时间限制的数据存储sessionStorage - 针对一个 session 的数据存储HTML5 使用 JavaScript 来存储和访问数据。 <script> //设置值:属性名字和值 window.sessionStorage.setItem('na...
2018-07-30 20:40:00 110
转载 HTML5本地文件的上传读取
window.onload=function(){ //读取文件,获取上传文件标签的这个对象 var f1=document.querySelector("#f1"); var f2=document.querySelector("#f2"); var f3=document.querySelector("#f3");//读取c...
2018-07-30 19:58:00 790
转载 HTML5网络状态检测
// var state=window.navigator.onLine;// if(state){// alert("在线的");// }else{// alert("不在线");// }//两个事件,联网就触发第一个,没网就立刻触发第二个 window.ononline=function(){ alert("连接上了");...
2018-07-30 01:38:00 602
转载 HTML5自定义属性
//自定义属性:html中没有这个属性,自己加,为了方便开发。//设置自定义属性:data-名字 都是小写的//获取自定义属性的值:dataset属性var dt=document.querySelector("#div1").dataset; console.log(dt.name);//对象.属性 console.log(dt["age...
2018-07-29 15:29:00 67
转载 HTML5选择器,类样式
选择器:css的选择器怎么用,这里就怎么用document.querySelector("选择器");//只能获取一个,默认第一个var op=document.querySelector("div p"); op.style.backgroundColor="yellow";document.querySelectorAll("选择器");//获取的是多个...
2018-07-29 02:34:00 198
转载 Html5表单元素
<form action="" method="get" id="fm" novalidate autocomplete="off"> <input type="text" value="" name="txt" autofocus placeholder="请输入用户名" required /> <input type="email" valu...
2018-07-29 00:38:00 77
转载 HTML5视频音频
视频video:<video controls aotoplay loop> <source src="myVideo.mp4"> <source src="myVideo.ogg"> <source src="myVideo.webm"> 对不起您的浏览器不支持 </v...
2018-07-28 17:39:00 92
转载 HTML5语义化标签
语义化标签:h5的语义化标签+css的方式进行布局 标签有自己的含义,浏览器或者程序员一看就知浏览器支持情况:IE9+,FireFox Chrome Safari oprea针对IE9以下兼容性问题: (1)在 该标签的css样式中设置:display:block 通过dom的方式创建这个标签:domcument.createElement('he...
2018-07-28 16:01:00 114
转载 javascript笔记
初识javascript注意:严格区分大小写,且以;结尾。调试程序:console.log()代替alert()。数据类型:typeof(变量)测试数据类型 1.Number(不区分整数和浮点数) NaN表示Not a Number Infinity表示当数值超过了js所定义的最大值 2.字符串string ...
2018-07-16 20:14:00 80
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人