- 博客(47)
- 收藏
- 关注
RSS订阅原创 javascript——BOM
1、重绘：样式改变即为重绘回流：当大小改变时即为回流。回流一定重绘，重绘不一定回流。回流有可能改变其他元素的位置，会大量的重绘，所以占内存较多。2、加载协议：http：超文本传输协议，默认脑端口号80https：加密。 由浏览器决定，选择加载速度较快的。3、定时器：setInterval（function(){},1000） ：间隔调用clearInterval
2016-12-26 21:57:36
320
原创 javascript——this指向
1、一般谁调用指向谁2、DOM 0级，Dom 2级 ——绑定事件的元素3、html——window4、 setInterval、setTimeout——window5、 闭包——window6、 自执行函数——window7、 call、apply——改变this指向8、 在函数中默认是window
2016-12-26 21:45:10
351
原创 javascript——事件
1、冒泡：事件从最具体的元素向上触发捕获：事件从最不具体的元素开始沿DOM树从上到下到事件的触发者结束。事件的传播机制：若同时存在，先执行捕获，事件触发者，再执行冒泡。2、DOM0级绑定事件：以冒泡处理，只有一个函数覆盖。元素.onclick = function（）{ }元素.onclick = null；3、DOM2级元素.addEventListener （cl
2016-12-26 21:42:23
324
原创 javascript——Dom
node节点：1、node节点分为6种：Document（文档）：nodeName（#document），nodeType（9），value（）、DocumentType（文档类型）：nodeName（html），nodeType（10），value（null）、Element（元素）：nodeName（标签名），nodeType（1），value（undefined、null
2016-12-26 18:21:40
329
原创 javascript——Math、Date
Math：1、Math.floor：向下取整2、Math.ceil：向上取整3、Math.round：四舍五入，若为负数，+0.5用floor。4、Math.abs：转化为绝对值5、Math.max：最大值，只用于数字。6、Math.pow（底数，指数）：2的2次方7、Math.sqrt（底数，指数）：根号38、Math.random（）：返回0-1 ，0可取到
2016-12-26 17:31:02
327
原创 javascript——对象、函数
对象定义：1、var obj = {}；2、var obj = new Object（）；3、var obj = Object.creat(null);属性方法：1、var obj = {p ：‘hello world’，q：‘sunny’}其中：obj为对象名，p和q为键名，后面为键值。若键值为函数，则p为方法。读取属性：obj.p或 obj['p']。
2016-12-26 17:15:03
316
原创 javascript——数组
定义：1、var arr = new Array（）；2、var arr = [1,'abc',4];属性：1、在头部添加：unshift2、将第一个移除：shift3、在最后面添加：push4、将左后一个移除：pop5、截取：arr.splice(开始位置，个数) //截取的东西6、arr.slice(开始位置包括本身，结束位置不包括本身)7、连接：arr
2016-12-26 16:39:31
242
原创 javascript——字符串
定义 ：var a=“abc”；var b=“def”；属性：1、长度：a.length //32、拼接：a.concat（b）； //bacdef3、b字符的索引值：a.indefOf('b') //1 若没有该字符：则返回-1。若重复，则值取到第一个。4、a.lastIndexOf('c') //35、截取字符串substr（3，5）：从第三个开
2016-12-26 16:14:11
234
原创 javascript中一些简单的知识点
1、组成：BOM（浏览器模型），DOM（文档模型），ECMAScript。ECMAScript和js本质相同，ECMAScript是js的规范，js是ECMAScript的实现。js从上往下，边解析边执行。2、变量命名：以字母、下划线、$开头。不允许为数字。3、数据类型：基本：undefined、null、布尔、number、string。引用：object。4、1/0位num
2016-12-26 15:59:03
298
原创 js中cookie解析
//1.获取所有cookie document.cookievar cookies = document.cookie;var json = {};//2.将字符串通过;号拆开cookies = cookies.split(';');//3.遍历所有信息for(var i = 0; i//4.将每条数据以=号拆开var data
2016-11-23 16:01:18
718
原创 js中cookie
/*** cookie是通过请求头发送 * 优点：* 1. 存储在本地* 2. 浏览器全兼容* 缺点：* 1. 每次都要发请求* 2. 在请求头明文不安全* 3. 存储量小 一般浏览器4KB ~8KB* 注意：* 1. 如果创建cookie时不指定日期 默认是会话cookie。关了就没了* 2. 指定过
2016-11-23 15:58:51
267
原创 css八大行星旋转实例
*{margin: 0;padding: 0;list-style: none;}ul{width: 600px;height: 600px;margin: 100px auto;background: rgba(0,0,0,0.5);position: relative;}li{width: 100%;height: 100%;bord
2016-11-23 15:55:49
2030
原创 js本地存储localStorage
/*** 存储在本地 的数据 * 优点：* 1. 速度快 ，不需要向服务器发请求* 2. 存储量大，约5MB* 3. 安全* 4. 生存周期（生命周期）是永久，只要不执行removeItem就永远存在* cookie与本地存储的区别* 1. cookie也是存在本地* 2. cookie存储的数据量小 一般4KB左路* 3.
2016-11-23 15:51:12
320
原创 css头像翻转实例
*{margin: 0;padding: 0;}.box{width: 200px;height: 200px;border-radius: 50%;margin: 100px auto;position: relative;}.box div{width: 100%;height: 100%;left: 0;top: 0;posit
2016-11-23 15:43:50
615
原创 css中央菜单实例
*{margin: 0;padding: 0;list-style: none;}ul{width: 1120px;margin: 100px auto;}li{float: left;margin: 0 5px;}li a{color: #fff;text-decoration: none;display: block;widt
2016-11-23 15:43:01
263
原创 js滚动刷屏小实例
*{margin: 0;padding: 0;}div{line-height: 40px;border: 1px solid red;}第1屏第2屏第3屏第4屏第5屏第6屏第7屏第8屏第9屏第10屏第11屏第12屏第13屏第14屏第15屏第16屏第17屏第18屏第19屏第20屏
2016-11-23 15:12:24
788
原创 js页面滚动条到页面的距离
//1.给窗口添加滚动事件 window.onscroll = function(){//2. 获取滚动时 滚动条到页面的距离var sTop = document.documentElement.scrollTop || document.body.scrollTop;console.log(sTop);}
2016-11-23 15:04:10
4501
原创 获取元素到页面的距离
* {margin: 0;padding: 0;}.father {width: 500px;height: 500px;background: pink;margin: 100px auto;padding-top: 1px;position: relative;}.son {width: 200px;height: 200px;
2016-11-23 15:02:22
1464
原创 js随时判断网络状态
//定义一个按钮查看连接/*** 任何时候发请求前都可以去检查连接*/var online = 0;//1.自定义函数用于判断服务器连接状态function ping(callback){//2.实例化对象 var img = new Image();//3.设置SRC img.src = '01.php'
2016-11-23 14:58:12
2467
原创 js使用预加载判断网络状态
// 首先，先定义一个按钮。 查询网络连接 //0.声明一个变量保存连接状态var online = 0;//1.实例化对象 var img = new Image();//2.设置SRC地址 img.src = '01.php';//3.添加加载事件 img.onloa
2016-11-23 14:55:09
944
原创 js中的图片预加载
//1. 实例化图片对象var img = new Image();//2. 设置图片地址img.src = 'https://www.baidu.com/img/baidu_jgylogo3.gif';//3. 添加事件 当图片加载错误时执行img.onerror = function(){console.log('加载失败！');}
2016-11-06 18:04:24
319
原创 ajax的跨域问题
浏览器有同源协议。 同一个根源。 同一个网站，同一个域名，同一个端口号。如果 域名和端口号不一样相互访问就会出现跨域问题！！！报错。jsonp可以跨域jsonp的跨域方式： 就是引入一个外部的JS文件。这个js文件放在别人家的服务器上然后它这个JS文件写的JS代码是用于执行我们页面中的函数，并且给我们传递参数（数据）1，使用script标签>//0
2016-11-06 13:34:53
200
原创 关于ajax原生的get请求和post请求
//get方式//1. 实例化一个ajax对象var xhr= new XMLHttpRequest();//2. 通过ajax对象打开一个地址 xhr.open("GET","../php/01.php");//3.send发送数据 xhr.send();//4.添加监听事件 去监听整个请求的状态 xhr.on
2016-11-06 13:25:01
1353
原创 javascript中的事件委托实例
//样式 #d1{width: 400px;height: 400px;background: pink; } #d2{width: 300px;height: 300px;background: yellow; } #d3{width: 200px;height: 200px;background: black; }
2016-11-06 13:19:05
297
原创 关于css中的一些小技巧
1、垂直居中：vertical-align:middle;2、渐变：background: linear-gradient(to bottom,#5fcaff,#ddf3ff);3、居中：position:absolute; left:50%; //top:50% transform:translateY(-50%); //translat
2016-11-06 13:16:24
249
原创 javascript 数组随机排序
html>html>head lang="en"> meta charset="UTF-8"> title>title>head>body>script> //第一种/* var arr=[1,2,3,4,5,6,7]; function suiji(arr){ for(var i=0;i<arr.length;i++){
2016-09-25 16:23:16
282
原创 Ajax的封装
/** * Created by zc on 2016/9/21. *//** * 哪些是公共不变的？ 哪些是可以改变的或者将来需要改变的，把这些改变的作为参数。 * 创建ajax 打开页面 发送数据 添加监听 这些是不变 * 可以改变的： * config = { * type:"请求类型" get||post, * url:"请求地址", *
2016-09-25 16:20:47
286
原创 javascript 向上滚动表格
*{ margin: 0; padding: 0; } .con{ width: 50%; margin: 0 auto; height: 400px; overflow: hidden;
2016-09-25 16:14:29
626
原创 javascript Tooltips
#div1{width:400px;height: 380px;border:1px solid deeppink;margin:100px auto;} #p1{line-height: 30px;margin:25px;} a{text-decoration: none;color:deeppink;} .titlebox{font-siz
2016-09-25 16:13:40
326
原创 javascript 淘宝右侧小选项卡
淘宝标题 *{ padding:0; margin:0;} .tab{ width:320px; height:100px; border:1px solid #eee; margin:10px; overflow:hidden;} .tab_title{ height:27px; background-color:#f7f7f7;
2016-09-25 16:12:50
431
原创 javascript 关于Bom的小实例
textarea{ width: 400px; height: 600px; border:1px solid deeppink; outline: none; } #ul{ background: #f5f5f5;
2016-09-25 16:03:24
373
原创 javascript url解析为对象
location.search截取 //?name=xiaohua&age=19&tel=123456789 varsearch=location.search.replace(/^\?/,"").split("&"); var obj={}; for(var i=0;i var arr=search[i].split("=");
2016-09-25 16:01:03
562
原创 javascript This指向问题简述
1、一般谁调用指向谁2、DOM 0级，Dom 2级 ——绑定事件的元素3、html——window4、 setInterval、setTimeout——window5、 闭包——window6、 自执行函数——window7、 call、apply——改变this指向8、 在函数中默认是window this关键字的用法 a、作为普通函数调用
2016-09-25 15:56:24
244
原创 javascript 原型链---继承方式怎么实现继承
function Father(money, house, car) { this.money = money; this.house = house; this.car = car; } Father.prototype.chuliMoney = function () { console.log("全扔给我
2016-09-25 15:54:37
344
原创 javascript Event兼容封装
/** * Created by zc on 2016/9/5. */ //跨浏览器处理事件程序 用对象var Event = { addEvent: function (ele,type,handler) { //Dom2级处理 if(ele.addEventListener){ ele.add
2016-09-25 15:47:27
277
原创 javascript 图片放大镜
图片放大镜 #d1{position: relative;cursor: pointer;width: 349px;height: 220px;float: left;} #img1{position: relative;} span{display:none;width:50px;height:50px;background: y
2016-09-25 15:45:20
347
原创 javascript 动态创建元素和数据
/*height:2090px;*/ body{background: #e1e1e1;} .all{ width:910px;margin: 0px auto;background:#fff;} .nav{width:910px;height:40px;background: #f6f6f6; } .nav ul{}
2016-09-25 15:39:39
270
原创 javascript 今年的倒计时
今年的剩余时间为：停止//自己想的 function left(){ var span2 = document.getElementsByClassName("timee").item(0); var today = new Date(); var EndYear = new Date(today.getF
2016-09-25 15:37:50
370
原创 javascript 慢慢返回顶部
body{height: 4000px;position: relative;} div{color:red;position:fixed;right:50px;bottom:30px;cursor:pointer;display:none} 返回顶部 var d1 =document.getElementById("d1");
2016-09-25 15:36:16
1007
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人