- 博客(214)
- 资源 (21)
- 收藏
- 关注
原创 ES6基础-数组
150讲轻松搞定Python网络爬虫 ES6新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:全新的界面设计 ,将会带来全新的写作体验;在创作中心设置你喜爱的代码高亮样式,Markdown 将代码片显示选择的高亮样式 进行展示;增加了 图片拖拽 功能,你可以将本地的图片直接拖拽到...
2020-06-13 21:19:32
394
原创 Vuex-数据状态管理
Vuexvuex简介单一使用vue.js使用vuex使用vue-cli脚手架创建vue项目vuex_demo功能项目结构及主要文件main.jsstore.jsAbout.vueProductOne.vueProductTwo.vue启动项目并运行总结stategettersmutationsactionvuex简介1.主要应用于Vue.js中管理数据状态的一个库2.通过创建一个集中的数据存...
2020-02-02 20:03:46
963
原创 ionic移动混合开发APP项目的创建、编译、运行、测试和打包
基于ionic移动混合开发APP项目的创建、编译、运行、测试和打包1.下载安装JDK环境,添加到环境变量中 Android ADT环境的搭建 -**添加环境变量 2.安装项目依赖环境 (1)npm install -g ionic cordova 3.创建ionic模板 (1)ionic start helloWorld (2)创建好模板进入...
2018-06-06 17:37:50
1914
原创 随机函数(随机取数)
Math.random( )是随机函数:随机取0~1之间的任意数;1、四舍五入函数如果是一位整数,那么就要用到四舍五入函数:Math.round( ); 例如:alert(Math.round(3.4));//3alert(Math.round(3.5));//42、随机0和1alert(Math.round(Math.random()));//随机取0或1
2017-09-01 21:50:58
9237
原创 数组排序
字符排序:var arr = ['c','a','d','b'];arr.sort();alert(arr);//a,b,c,d数字排序: 数字排序不能直接使用sort( )方法,因为它是直接先比较第一位数字var arr1 = [1,5,3,8,56,23,2];arr1.sort();alert(arr1);//1,2,23,3,,5,56,8应该在sort( )方法
2017-09-01 21:50:42
431
原创 数组去重
var arr = [1,2,2,3,5,2,4,6];// 循环遍历数组for(var i = 0;i<arr.length;i++){ for(var j = i+1;j<arr.length;j++){ if(arr[i] == arr[j]){// 第一位和第二位进行比较 arr.splice(j,1);//干掉第j个,干掉1个
2017-09-01 21:50:23
413
原创 数组 — 方法
快速清空数组方法:方法一:arr.length = 0;//直接让数组的长度为0来清空数组alert(arr);//什么都不显示方法二:var arr = [];//直接定义一个新数组也是清空数组(推荐这个,效率高)alert(arr);//什么都不显示设定数组长度:var arr = ['aa',2,3];alert(arr.length);//3arr.leng
2017-09-01 21:50:02
726
原创 全文替换字符
html:"text">"button" value="查找">计算机(computer)俗称电脑,是现代一种用于高速计算的电子计算机器...量子计算机等。css:p {width: 520px;height: 110px;border: 4px solid #ccc;padding: 10px;}span {background-color: yellow;}//用于匹
2017-09-01 21:49:43
1033
原创 全文查找匹配字符
html:"text">"button" value="查找">计算机(computer)俗称电脑,是现代一种用于高速计算的电子计算机器...量子计算机等。css:p {width: 200px;height: 350px;border: 4px solid #ccc;padding: 10px;}span {background-color: yellow;}//用于匹配的文字
2017-09-01 21:49:11
780
原创 json
json非常适合服务器和js中间进行数据的交互;var json = {name:'张三',age:18};//定义jsonalert(json.name); // 访问jsonvar arrUrl = ['img/1.jpg','img/2.jpg','img/3.jpg','img/4.jpg'];var arrTxt = ['海上帆船','小台灯','椰子树','照相机'];
2017-09-01 21:48:13
529
原创 字符串操作总结
var str = '百度-www.baidu.com';str.charAt(1);//度 根据子字符串的下标返回字符串从0数str.charCodeAt(0);//24230 根据子字符串的下标返回字符编码String.fromCharCode(30334,24230);//'百度' 根据编码返回字符串str.indexOf('b',1);//7 字符串查找 从左到右查b,
2017-09-01 21:47:44
322
原创 字符串连接join( )
join( )括号中不加任何参数,默认是逗号连接var arr = ['aa','bb','cc','dd'];alert(arr.join());//aa,bb,cc,ddjoin( )括号中加单引号,连接:alert(arr.join(''));//aabbccddjion( ) 括号中添加分隔符:alert(arr.join('-'));//aa-bb-cc-dd
2017-08-30 19:20:28
3378
原创 字母大小写转化
var str = 'www.baidu.com';alert(str.toUpperCase());//WWW.BAIDU.COM 转成大写字母alert(str.toLowerCase());//www.baidu.com 转成小写字母
2017-08-30 19:19:49
485
原创 文字收缩、展开(默认展开)
html:p>span>JavaScript 是属于网络的脚本语言!JavaScript被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。JavaScript是因特网上最流行的脚本语言。JavaScript 很容易使用!你一定会喜欢它的!span>......a href="javascript:;">>>收缩a>p>js:这里写代码片
2017-08-30 19:19:25
2635
原创 字符串截取
1、substring( )截取字符串:substring(a,b ); a:从0数,第a位开始; b:取b个字符串; 例如: substring( 2,3)表示从0数到2,然后截取3个字符(包括第2位字符); 如果后面数字比前面数字大,那么就会调换数字位置; 如果substring( a)中只有一个数字,就是从0数到a,截取到最后(包括a);var str1 = '人生如酒,
2017-08-30 19:19:08
3068
1
原创 字符串操作
var str = 'www.baidu.com/i2017';// 如果想找i所在的位置,从0开始数,第六个是ialert(str.indexOf('i'));//6 从0开始数第一次出现i是在第6位alert(str.indexOf('i',8));//14 从0数到8开始出现i是在第14位// 如果出现-1表示没有找到字符例如: 查找下面一段话中“人生”在这一段文字中出现的
2017-08-30 19:18:49
326
原创 字符串的比较
字符串的比较其实就是字符串的编码进行比较,例如: 字母a的字符编码是97,字母b的编码是98,98明显大于97,所以’b’>’a’;alert('张三' > '李四');//false 比较'张'和'李'的字符编码alert('abbb' > 'b');//false 比较a和b,a是97,b是98,所以b>a,返回false
2017-08-30 19:18:07
625
原创 检测输入是否全是数字
html:type="text">type="button" value="检测">js:这里写代码片注意: 从文本框中取出来的值都是字符串类型;
2017-08-30 19:17:06
1866
原创 字符串操作
// 字符串长度var str = '我是字符串';alert(str.length);//5// 如果字符串前面有空格,也算在字符串长度里面var str1 = ' 我是字符串';alert(str1.length);//7 因为前面有两个空格// 找到字符串中的某个子字符var str2 = '我是字符串';alert(str2.charAt(2));//字 从0开始
2017-08-30 19:16:49
269
原创 获取年、月、日、时、分、秒
js:window.onload = function(){ // alert(new Date());//弹出 当前 系统的时间对象 var myTime = new Date(); var iYear = myTime.getFullYear();//获得当前年份 // alert(iYear);//2017 得到年份 var iMonth
2017-08-24 06:56:40
521
原创 一组图片上下抖动
html:"img/1.jpg" alt="">"img/2.jpg" alt="">"img/3.jpg" alt="">...css:img { width: 100px; height: 100px; position: absolute; top: 200px;}js:window.onload = function(
2017-08-24 06:55:27
747
原创 左右抖动之后上下抖动
html:img src="./img/19.jpg" alt="" id="img1">css:img { position: absolute; top: 200px; left: 300px;}js:script src="doMove.js">script>script> window.onload = function(){
2017-08-24 06:55:04
1002
原创 抖动函数封装
js:function shake(obj,attr,endFn){//obj谁来抖动,attr是哪个元素值进行改变(横着抖,竖着抖),endFn回调函数(就是抖完之后干嘛) // 先获得图片原来left值,在此基础上进行抖动;parseInt()是把300px的单位去掉只留数字 var pos = parseInt(getStyle(obj,attr)); var
2017-08-24 06:54:29
698
原创 图片左右抖动、上下抖动
点击图片,图片会左右抖动(GIF图片效果不太明显,实际效果比这要好看);html:img src="./img/19.jpg" alt="" id="img1">css:img { position: absolute; top: 200px; left: 300px;}js:script src="doMove.js">script>scrip
2017-08-24 06:52:11
7818
原创 动画函数 doMove.js
用动画可以直接引用这个动画函数文件,然后调用doMove()函数。 js:'use strict';// 运动函数function $(id){return document.getElementById(id);} function doMove(obj,attr,dir,target,endFn){//参数分别代表:元素、上下左右方向运动、方向(正反方向)、
2017-08-04 19:06:51
2180
1
原创 运动 — 每个滑块依次落下
点击任意位置,红色方块都会依次落下;首先引用动画文件doMove.js,动画函数是封装好的,具体参考上篇文章:script src="doMove.js">script>js:var str = '';var len = 20;var oDiv = document.getElementsByTagName('div');//选中页面上的所有div元素var timer =
2017-08-04 19:06:28
363
原创 滑块运动 — 到目标位置高度展开
具体html、css不变,参考滑块运动 — 到目标位置宽度展开,js只改动一个地方: 只要把回调函数中的width改成height,展开高度和展开速度自己随便调;$('btn').onclick = function(){ doMove(div1,'left',5,250,function(){ doMove(div1,'height',4,200);//回调函数
2017-07-28 16:45:59
453
原创 滑块运动 — 到目标位置宽度缓慢展开
点击按钮,方块运动到右边目标位置,然后宽度展开; 也可以设置高度展开参考下一篇文章;html:"button" value="运动" id="btn"> div id="div1">div>css:#div1 { width: 50px; height: 50px; background-color: red; position: absol
2017-07-28 16:45:42
364
原创 滑块运动 — 上下
html:type="button" value="向下" id="btn1">type="button" value="向上" id="btn2">"div1">css:#div1 { width: 50px; height: 50px; background-color: red; position: absolute; top: 5
2017-07-28 16:45:21
1397
原创 滑块运动 — 左右
html:type="button" value="向右滑动" id="btn1">type="button" value="向左滑动" id="btn2">"div1">css:#div1 { width: 50px; height: 50px; background-color: red; position: absolute; to
2017-07-28 16:45:03
775
原创 滑块运动 — 向右
点击按钮,红色方块向右运动;无论怎么连续点击按钮,滑块始终匀速前进html:"button" value="向右滑动" id="btn">div id="div1">div>css:#div1 { width: 50px; height: 50px; background-color: red; position: absolute; to
2017-07-28 16:44:43
955
原创 定时器 — 延时小菜单
鼠标放在qq框中,title提示框过一会出现;鼠标移开qq框,title提示框过一会消失html:div id="qq">div>div id="title">div>css:#qq { width: 150px; height: 300px; background-color: #f9c;}#title { width: 100px;
2017-07-28 16:44:23
345
原创 定时器 — 图片自动切换(轮播图)
自动播放轮播图,鼠标放在图片上轮播停止;鼠标移开,继续轮播; 一种是打开页面就开始轮播; 另一种是打开图片过几秒再开始轮播(具体看下面js代码);html:"pic"> "img/1.jpg" alt=""> 数量正在加载... 文字正在加载... css:body {background-color: #333;}ul {padding
2017-07-27 16:05:37
11485
1
原创 定时器 — 弹窗广告
页面打开之后2秒钟开始弹出广告,广告弹出3秒钟之后自动关闭广告(只执行一次);例如:看视频时,刚打开视频5秒钟后,右下角弹出一个广告,过5秒自动关闭广告;html:img src="img/ad.png" alt="广告" id="ad">css:body {background:url(img/bg.png) no-repeat center 0; text-align: c
2017-07-27 16:05:16
858
原创 定时器 — 换背景图片
html:type="button" value="点我换个背景吧">type="button" value="停!">js:var btn = document.getElementsByTagName('input');//获取按钮var arrUrl = ['img/13.jpg','img/14.jpg','img/15.jpg','img/16.jpg'];//图片数
2017-07-27 16:04:58
2667
原创 定时器
定时器:在某一定的时间之内发生一些事;有时间的概念;for(var i=0;i5;i++){ }//瞬间执行,没有时间根据设置定时器:var timer = setInterval(函数,时间毫秒); 关闭定时器:clearInterval(timer);一个函数执行有以下几种方式: 1、直接调用:fn1( ); 2、事件调用:document.onclick = fn1; 3
2017-07-27 16:04:34
5449
原创 获取样式 currentStyle与getComputedStyle
currentStyle与getComputedStyle 都是获取样式; currentStyle()兼容IE6、7、8 getComputedStyle()不兼容IE6、7、8 getComputedStyle得到的是计算机(浏览器)经过计算后的样式:如果同时有行内样式和样式表,那么优先选择行内式;如果js中也设置样式,那么优先选择js中的样式;下面的例子是获取一个盒子的宽度:h
2017-07-27 16:04:17
477
原创 函数 - arguments
arguments:参数的集合fn1(1,2,3);//实参function fn1(a,b,c){//形参 // arguments ==> [1,2,3]实参的集合 //alert(arguments);//object Arguments alert(arguments.length);//3 alert(arguments[0]);//1 al
2017-07-27 16:03:57
256
DIV+CSS3.0网页布局案例
2017-03-14
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人