- 博客(30)
- 收藏
- 关注
RSS订阅原创 关于Web Storag和cookie
如何实现浏览器内多个标签页之间的通信?调用localstorge、cookies等本地存储方式.1.<iframe>优点： 解决加载缓慢的第三方内容如图标和广告等的加载问题 Security sandbox 并行加载脚本2.<iframe>的缺点： iframe会阻塞主页面的Onload事件； 即时内容为空，加载也需要时间s...
2019-03-04 21:48:07
234
原创 规则瀑布流效果（局部刷新）
html部分<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>瀑布流效果--规则的(局部刷新)</title> <style type="text/css"> /*
2019-02-25 18:47:11
444
原创 get请求传参案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><ul>
2019-02-25 18:23:48
1534
原创 用jquery，写轮播图
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <title>京东轮播图</title> <style> * { margin:
2019-02-19 21:47:23
328
原创 简单总结jquery的一些方法
<script> /* *jq转换js : jq对象.get[索引] * 获取到的li元素中，选择索引号为2的元素，索引号index从0开始。 .eq（index） * 获取索引的方法： .index() *筛选选择器(方法): * .children() find() next() prev() siblings() *...
2019-02-19 21:23:42
143
原创 jquery中class操作
设置单个样式 .color(“样式名”，“样式值”)设置多个样式 .css({“样式名”:“样式值”,“样式名”:“样式值”})获取样式 .css(“样式名”)添加类 . addClass()移除类 .removeClass()判断类 .hasClass()切换类 .toggleClass()设置单个属性 .attr(“属性名”,“属性值”);设置多个属性...
2019-02-18 18:06:19
447
原创 jquery轮播图
js的缺点Js不好的地方:1.代码冗余2.需要遍历，很麻烦3.有兼容性的问题4.添加动画很麻烦5.会覆盖jquery的优点 1.方便快捷，简单粗暴2.不需要遍历：具有隐式迭代的特点，会自动遍历。3.操作动画简单4.完全没有兼容性5.不会覆盖&lt;!DOCTYPE html&gt;&lt;html lang="zh-CN"&gt;&lt;head&
2019-02-18 17:54:45
506
1
原创 继承
组合继承：借用构造函数 和在原型对象上改变this指向拷贝继承：把一个对象的属性和方法复制到另一个对象总结：原型的作用：继承—》目的：节省空间原型继承：改变原型的指向借用构造函数继承：.call（） 主要解决属性继承组合继承：原型继承+借用构造函数继承拷贝继承：把对象中需要共享的属性和方法直接以遍历的方式复制到另一个对象<script> function P...
2019-01-21 18:54:03
1352
原创 完整版祝福墙
body { margin: 0 auto; padding: 0px; font-size: 12px; background: url("images/bg.gif") repeat center 36px; text-align: center; background-color: #c30230;}#content { margin: 0 auto; ...
2019-01-21 18:26:58
147
原创 面向过程和面向对象思想
<style> div{ width: 200px; height: 200px; background-color: pink; }</style>//点击更改div的颜色//面向过程/* document.getElementById(“btn”).onclick=function () {d...
2019-01-17 19:09:25
156
原创 随机产生小方块
加粗样式 //对象：随机数 ，小方块 //产生随机数的对象 ((function () { //1.产生随机数的构造函数 function Random() { } //2.在原型中添加方法 Random.prototype.getRandom=function (max,min) { return...
2019-01-17 19:00:58
439
原创 旋转木马
function getStyle(ele,attr) { return window.getComputedStyle ? window.getComputedStyle(ele,null)[attr] : ele.currenStyle[attr]; }function animate(ele,json,fn) { clearInterval(ele.timeId...
2019-01-16 22:14:36
212
原创 滚动条
//滚动条的高/装滚动条的div高 = box高/文字div的高//滚动条的高=装滚动条的div高*box高/文字div的高//最外面的divvar box=myTab("box");//文字divvar content=myTab("content");//滚动条的divvar scroll=myTab("scroll");//滚动条var bar=myTab("bar");...
2019-01-16 22:12:22
204
原创 筋斗云
var list=myTab("navBar").children;var liWidth=0;for(var i=0;i<list.length;i++){list[i].onmouseover=function(){liWidth=this.offsetLeft;animate(myTab(“cloud”),liWidth);console.log(liWidth);}...
2019-01-15 21:51:28
8416
原创 跟着鼠标走
window.onmousemove=function (e) {/console.log(e);console.log(e.clientX);console.log(e.clientY);/myTab(“im”).style.left=e.clientX+“px”;myTab(“im”).style.top=e.clientY+“px”;}event.clientX事件属性返回当事...
2019-01-15 21:49:17
252
原创 手风琴
//给每一个li添加背景图片var list= myTab("box").getElementsByTagName("li");for(var i=0;i<list.length;i++){ list[i].style.backgroundImage="url(images/"+(i+1)+".jpg)"; list[i].onmouseover=function () { ...
2019-01-15 21:42:29
101
原创 轮播图之根据小圆点滑动图片
<style> * { margin: 0; padding: 0 } ul { list-style: none } img { vertical-align: top } .box { width: 730px; height...
2019-01-14 21:34:31
1849
原创 事件的阶段
三个阶段1.事件捕获阶段：从外向内触发2.事件目标阶段：最开始选择的那个3.事件冒泡阶段：从里向外触发案例： 百度//同时给三个div注册点击事件var arr=[myTab(“dv3”),myTab(“dv2”),myTab(“dv1”)];arr.forEach(function (ele,i) {// 给每一个绑定点击事件ele.a...
2019-01-11 13:06:05
207
原创 点击创建表格
<style> #dv{ width: 300px; height: 200px; border: 1px solid red; }</style>var arr=[ {name:"百度",href:"http://www.baidu.com"}, {name:"谷歌",href:...
2019-01-10 18:44:32
145
原创 点击更换背景图片
<style> * { margin: 0px; padding: 0px; } body { background-image: url("images/1.jpg"); } #mask { background-color: rgba(255, 255, 255, 0.3); ...
2019-01-09 19:12:06
539
原创 全选和不全选
<style> * { padding: 0; margin: 0; } .wrap { width: 300px; margin: 100px auto 0; } table { border-collapse: collapse; border...
2019-01-09 19:08:18
269
原创 节点的兼容代码
//2.写获取前一个兄弟元素和后一个兄弟元素的兼容性代码function getPreviousSiblinf(ele) {if(ele.previousElementSibling){return ele.previousElementSibling;}else {var nodes=ele.previousSibling;while (nodes && nodes....
2019-01-09 19:04:09
150
原创 关于textContent的问题
hahahd//innerText 谷歌 火狐 ie 都支持// textContent 谷歌 火狐 都支持 ie8不支持my$("btn").onclick=function () { my$("div").textContent="这首歌好" /* console.log(my$("div").innerText); console.log(my$("div...
2019-01-08 22:31:47
991
原创 tab选项卡切换
Title 体育 唱歌 弹吉他这是体育这是唱歌这是弹吉他// tab选项卡切换var lis= myHanshu(“tabs”).getElementsByTagName(“li”);var divs=myHanshu(“div”).getElementsByTagName(“div”);for(var i=0;i...
2019-01-08 22:24:08
102
原创 String对象
常用属性：.length 字符串的长度.charAt(索引) 返回值是制定索引位置的字符串，索引值超出了，返回时空字符串.concat(字符串1，字符串2…) 返回的是拼接之后新的字符串.indexOf(要找的字符串，从某个位置开始即索引值) 返回的是这个字符串的索引值，找不到则返回-1.replace(“原来的字符串”,“新的字符串”) 替换字符串的.slice（开始的索引，结...
2019-01-07 13:10:33
154
原创 Date对象
Dated对象常用的方法：.getTime() // 返回毫秒数和valueOf()结果一样，valueOf()内部调用的.getTime().getMilliseconds().getSeconds() // 返回0-59.getMinutes() // 返回0-59.getHours() // 返回0-23.getDay() // 返回星期几 0周日 ...
2019-01-07 13:04:18
74
原创 Array对象
常见的Array对象方法.concat(数组1，数组2…)组合成一个新的数组.every(函数) 返回值是布尔类型,这个函数中有三个参数，一假即假.some(函数) 返回值是布尔类型，这个函数中有三个参数，一真即真.filter(函数) 返回的是数组中每一个符号条件的元素，组成的一个新的数组.push(值) 把这个值追加到数组的末尾，返回值是追加后数组的长度 ....
2019-01-07 12:58:12
127
原创 Math对象
**对象有2种：** 静态对象：不需要创建，直接通过这个对象名字调用即可（内置对象）实例对象：通过构造函数创建出来，实例化的对象Math常用的方法：Math.PI;–》圆周率Math.abs(值)–》取绝对值Math.ceil(值)—>向上取整Math.floor(值)—>向下取整Math.round（值）–>四舍五入Math.max(值1，值2…)—>...
2019-01-07 12:56:58
213
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人