- 博客(20)
- 收藏
- 关注
原创 JavaScript中的时间动画效果和运动算子和动画序列
1. 时间实现动画效果var div = document.querySelector("div");var distance = 1000; //总共的距离var duration = 2000; //总共的时间var initLeft = div.offsetLeft; //初始化left值var startTime = new Date(); //动画开始时间setT...
2018-08-19 09:55:43
401
原创 JavaScript中的正则表达式
2. 正则表达式 创建正则表达式 使用构造函数 var reg = new("正则表达式","匹配模式"); 使用字面量 var reg = /正则表达式/gi; g表示全局匹配 i表示忽略大小写 全局模式 全局模式是每次测试都是从lastIndex开始测试 不是全局模式的话,每次测试都是从开头开始测试 las...
2018-08-19 09:54:38
439
原创 JavaScript中的BOM操作
4. BOMdocument.documentElement 指的是html4.1 获取窗口的大小window.innerWidth,window.innerHeight这种方式不支持IE8 及以下,要兼容IE可以使用document.documentElement.clientWidth和document.documentElement.clientHeightvar w ...
2018-08-19 09:54:01
254
原创 JavaScript中的DOM2级事件及键盘事件和事件代理
1. DOM2级事件1.1 addEventListenterdiv.addEventListener("click",function () { console.log("22");},true); 参数一: 事件类型(不能加on) 参数二: 事件处理程序 参数三: 布尔值,true表示捕获阶段,false表示冒泡阶段,不写代表冒泡阶段 ...
2018-08-19 09:52:57
404
原创 JavaScript中的鼠标事件及事件对象
1. 鼠标事件 mouseover和mouseout 当鼠标进入元素区域内触发和离开元素区域内触发 这两个事件是冒泡的,就是当前事件会冒泡给父元素,一层一层冒泡 mouseenter和mouseleave 与mouseover和mouseout效果一致,但是这两个事件不冒泡 2. 事件对象的属性2.1 常用属性 bubble 返回的是布尔值,表示...
2018-08-19 09:51:30
1783
原创 JavaScript中的事件与事件类型
4. 事件事件处理程序中的 this, 是指前面的事件源对象.4.1 事件的三要素: 事件源:事件发生在哪个元素上 事件处理程序:给事件赋的函数 事件对象 (包含事件发生的所有的信息: 事件源是谁, 发生的坐标, 什么阶段....) DOM0级事件处理:var div = document.querySelector("div");div.onclic...
2018-08-19 09:50:27
248
原创 JavaScript中的offsetWidth,offsetHeight,offsetLeft,offsetTop
1. 获取宽高left,top值的简便方法 获取宽度 元素对象.offsetWidth 获取到的值会包括边框,padding值,自身宽度 获取高度 元素对象.offsetHeight 获取到的值会包括自身高度,边框 ,padding值 获取父元素 元素对象.offsetParent 获取到的是它的参考父元素 而`parentElement`获取到的...
2018-08-19 09:48:06
981
原创 DOM节点之间的关系,与节点的基本操作
1. 节点之间的关系1.1 第一种获取方式以下获取节点都会获取所有的节点类型,不只是包括元素节点,还有文本类型等 获取一个元素节点的所有子节点 元素节点对象.childNodes 获取到的是一个类数组 NodeList 获取一个元素节点的第一个子节点 元素节点对象.firstChild 获取一个元素节点的最后一个子节点 元素节点对象.lastChi...
2018-08-19 09:43:23
2835
原创 JavaScript中的定时器,JavaScript中的DOM节点,获取元素的样式
1.window对象window对象是ECMAScript中定义的浏览器端的全局对象global是服务器端的全局对象页面中定义的全局变量和函数,都会成为window对象的属性和方法2. 定时器2.1setTimeout定时器setTimeout(function(){ //要执行的代码},5000)这个定时器的含义是指,执行到这行代码时,等5s后将参数一的代码...
2018-08-19 09:41:08
571
原创 JavaScript中的字符串,JavaScript中的日期对象
1. 字符串1.1 基本知识字符串分为: 基本数据类型中字符串 "" '' String() 使用+连接 对象中的字符串(包装类) 使用构造函数String创建字符串对象 new String("abc") new String(222) 注意:在JavaScript中,字符串是不可变的,只要是涉及到字符串的更改,都是创建新的字符串字符串中也有len...
2018-08-19 09:39:21
399
原创 JavaScript数组及数组中常用方法
1. 数组1.1 创建数组对象 通过字面量创建数组: var arr=[10,20,30,40]; 通过构造函数创建对象 var arr1= new Array(10,20,30,40); 数组中的元素是可重复且有序的 注意:用构造函数创建一个数组对象时,如果传入的只有一个参数且这个参数为整数时,此时这个参数会被认为是数组的长度如 :var a...
2018-08-03 23:36:41
436
原创 JavaScript原型
1. 原型 在JavaScript中,一切皆对象 对于基本数据类型,也有包装类型把它们包装成一个对象来使用 只要是对象,那么就一定有属性和方法 对于函数,也是对象,那么他也有属性和方法那有什么属性呢?函数一旦声明成功,那么每个函数对象都有一个属性prototype这个prototype指向的就是函数的原型对象而原型对象中也有一个属性constructo...
2018-08-03 23:36:10
119
原创 JavaScript基本数据类型和运算符
1. 常用的调试方法 弹出警告框: alert("警告的内容"); 弹出确定框: confirm("文本内容"); 输入框: prompt("提示文字","默认值"); 向控制台输入结果: console.log("我会在控制台显示"); 向页面中输入内容: document.write("我会在页面中显示") 2.数据
2018-07-29 10:58:46
370
原创 文本属性,字体,长度单位
1. 字体 设置字体颜色: color:; 设置字体样式: font-style:normal/italic; 斜体/正常 设置字体: font-family:; 多个字体用逗号隔开 设置字体大小: font-size:; 设置字体粗体: font-weight:normal/bold; 正常/加粗bolder比父元素字体大小大一点lighter比父元...
2018-07-29 10:58:02
429
原创 css定位和css背景
1. 定位定位:position : ;有4个值:static静态定位(默认值,没有定位) , relative相对定位, absolute绝对定位,fixed固定定位1.1 相对定位相对定位:position:relative;相对定位的特点: 相对于静态位置的定位,它不会脱离文档流. 就算离开之前的位置,也不会影响页面的布局 有4个方向的值:l...
2018-07-23 23:15:26
705
原创 css的浮动以及清除浮动的方法
1. 内联元素的盒模型内联元素可以分为替换元素和非替换元素 替换元素: 浏览器会根据元素的标签和属性,来决定显示的内容 除了不会独占一行,其他跟块元素没有什么区别,(能设置宽和高) 常见的有input img 非替换元素: 显示就是元素本身的内容 不能设置宽高 常见的有a span ...
2018-07-22 12:11:01
165
原创 css特性及盒子模型
一.css的三大特性继承性层叠性优先级1.1 继承性后代元素会继承祖先元素的某些样式,这就是css的继承性如果继承了多个祖先的相同的样式,那么采用就近原则,哪个祖先离得近,就用哪个祖先继承过来的样式哪些能被继承?哪些不能被继承呢?color font-xxx text-xxx line-xxx能被继承background 关于布局,定位之类的不能被继承1.2...
2018-07-20 22:57:04
188
原创 CSS的常用选择器
一.css基本语法1.1 css基本组成1.css由选择器和声明块组成<style> p{ color:red; font-size:30px; } </style>上面的样式中p就是一个选择器,大括号中的一条或多条声明就组成了声明块.1.2 css选择器1.2.1 简单选择器: ...
2018-07-18 19:31:13
258
原创 列表与表单
一.常用的标签1.1 img标签img标签是指引入一个外部的图片<img src="" alt=""> src指的是一个图片的路径,跟a标签中href属性的路径设置是一样的 alt属性为当图片显示不出来的时候显示的文字 img可以设置宽高,为等比例缩放,设置了宽度则会自动等比例设置高度图片的格式 1.JPEG(JPG) JPEG图片支持的颜...
2018-07-18 19:30:15
1129
原创 HTML基本知识
一. HTML文档结构1.1 文档声明1.html5的声明<!DOCTYPE html>1.2 文档的标签<html> <head> <title></title> </head> <body> </body>&
2018-07-18 19:29:30
156
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人