lxhby520-CSDN博客

原创 javascript--40--正则

元字符正则表达式：是一套规则字面量:// new RegEXP("这中间就是规则");一般用来处理字符串的查询或者替换工作元字符：\ 转移符\d 匹配数字【0-9】\D非数字 var str="123abdfns"; var reg = /1/; console.log(reg.test(str));结果是true; reg.test(str) 在str 里匹配reg规则如...

2018-07-04 11:36:01 311 2

原创 javascript--39--拓展

queryselect兼容 ie不兼容querselector想 query(".box").css({}).onclick("click")expressionexpression ccs表达式选择到节点 ie8以下就可以使用已经被废弃鼠标移动或者窗口移动改变就触发 css 里面写任意的js代码表达式里面有个关键字 this 指向节点本身expression 最大的问题鼠标移动或窗口改...

2018-07-04 11:35:15 178

原创 javascript--38--完整版事件封装

事件监听监听多个事件传多个事件类型<body> <div id="box"></div><script> eventBind(box,"click",function (event) { console.log("1"); },false); eventBind(box,"clic

2018-07-04 11:34:25 1025

原创 javascript--37--事件委托

事件委托在大盒子上绑定事件但是触发的是子节点<body><div class="box"> <ul> <li>列表1</li> <li>列表2</li> <li>列表3</li> <l

2018-07-04 11:33:43 159

原创 javascript--35--表单事件键盘事件

表单事件表单基本布局<form action="" class="user-reg"> <label class="form-item"> <strong>用户名：</strong> <p> <input type="text" name=&qu

2018-07-04 11:32:58 652

原创 javascript--34--默认行为和滚动事件

默认行为移动端用的多默认行为：选中复制选中文本事件document.onselectstartdocument.onselectstart = function(){ console.log("选中"); }每选择一次在控制台打印一次右键点击出现菜单document.oncontextmenudocument.oncontextmenu = function(e){ ...

2018-07-04 11:32:16 569

原创 javascript---33--event对象事件监听

event对象冒泡与捕获<style> *{ padding: 0; margin: 0; } .box{ width: 100px; height: 100px; background-color: #f66; } </style>...

2018-06-17 18:35:10 204

原创 javascript--30--bom

浏览器标识兼容做法在谷歌浏览器中#box{ padding: 10px; width: 200px; height: 200px; overflow: hidden; } #child{ height: 300px; } </style></head><body> &...

2018-06-14 19:23:31 162

CSSOM视图模式获取窗口的宽高window.innerWidth 窗口宽度console.log(window.innerWidth);结果是1120 ，当缩小浏览器刷新就会变小window.innerHeight 窗口高度但是从ie8以下就不能用console.log(window.innerHeight);结果是634document.documentElement.clientWidth...

2018-06-14 19:22:53 214

原创 javascript---28--DOM文档对象模型

节点什么是节点你好是文本节点<div>元素节点class id value是属性节点注释节点获取节点ele.childNodes获取元素节点+ 文本节点但是只获取子代不能获取孙子代<div id="wrap"> <div class="position"&

2018-06-14 19:22:08 160

原创 27--花式轮播图笔记

轮播图布局<style> *{ margin: 0; padding: 0; } li{ list-style: none; } .banner{ position: relative; ...

2018-06-10 22:30:05 343

原创 javascript--25--时间版运动框架

简单版时间运动框架.box{ width: 100px; height: 100px; background-color: pink; } </style></head><body> <div class="box"></div></body>&amp

2018-06-06 20:20:37 203

原创 javascript--24-速度版运动框架

请求动画帧setTimeout(fn,1000)缺点是不准时会受到页面的影响当代码多的时候就会一卡一卡requestAnimationFrame 请求动画帧requestAnimationFrame(function () { console.log(1); })与setTimeout类似，但是不能设置时间根据浏览器刷新频率执行重绘多少次就执行多少次var date =new ...

2018-06-05 16:50:01 200

原创 javascript--22--日期对象

回顾定时器function f1() { console.time("time span"); } function f2(){ console.timeEnd("time span"); } setTimeout(f1,100); setTimeout(f2,200); function waitForMs(n){...

2018-06-04 18:48:33 353

原创 javascript--21--定时器

定时器setTimeout循环一次setTimeout(boom,1000) function boom() { console.log("boom"); }在一秒之后执行函数只执行一次只能用毫秒一小时1000*60*60setInterval循环多次setInterval(boom,1000) function boom() { co...

2018-06-04 18:47:47 210

原创 04-html命名规范

html的命名规范命名规范见名知义header 头部 menu菜单栏 banner导航栏 show显示不要用拼音或汉语不准数字开头命名可以用下划线或横杠命名，一般用来拼两个名字命名的两种方式class类命名：指代一类用法可以使用多个类命名id命名具有唯一性企业命名规范标题: title摘要: summary箭头： arrow商标： label网站标志： logo转角/圆角： corner横幅广...

2018-05-31 23:05:39 401

原创 javascript--19--git github

gitgit bash 出现了界面自报家门 git config --global user.name yyy 输入自己的名字按enter键输入邮箱 git config --global user.email ...清屏 clear本地完成仓库的创建cd c:进入c盘ls查看文件夹里装的内容ll除了可以看见文件夹外还能看见文件日期文件属于谁文件权限ll -a比详情更详细的详情出现./ ...

2018-05-31 23:04:24 121

原创 javascript--18---数组的遍历与去重

严格模式在es5引入为了让团队开发更为便利严谨变量必须在声明之后才能使用"use strict"a=1;console.log(a);结果会直接报错函数的参数不能同名"use strict"function f(a,a,b) { }结果会直接报错不能对只读的属性赋值否则会报错"use strict";var str ="123";str.length =1;//可读不可写...

2018-05-31 23:03:29 243

原创 javascript--17-字符串方法-数组方法

字符串方法2indexOf 查找字符串返回索引值查找当前字符串的索引值从左到右第一次出现的位置如果没有找到返回-1 第二个参数表示从第几个字符串后面开始找var str ="124590" console.log(str.indexOf("9"));结果是4var str ="124590" console.log(str.indexOf("a"));返回值是-1var str ...

2018-05-31 23:02:39 153

原创 javascript--16-this和字符串

this作为普通函数的调用/自执行 this 在自执行（函数名/变量名()）/全局时，this指向window 实际上并不是指向了window 而是指向null 被解释成了window 在es5的严格模式时候自执行 this指向undefinedfunction fn() { console.log(this); } fn();结果是window"use str...

2018-05-30 19:19:03 404

原创 javascript--15-对象和json

什么是对象js的一种数据类型写法{}new ObjectObject.create({})格式{键：值}多个键值用逗号分隔键表示属性名值表示属性值值：必须储存数据可以是任意数据类型和数组类似变量会被解析键：键可以加引号，可以不加引号可以写字符和数值类型其他类型不能书写如果键名和变量名一致那么可以直接写变量进去变量名表示键的值 var name ="lisi"; var obj ...

2018-05-30 19:18:24 115

原创 javascript--13---闭包

获取局部变量<script> function fn1() { var a ="月薪10w"; } alert(a);</script>如何获取内部变量作为函数返回值<script> function fn1() { var a ="月薪10w"; return a; } alert(fn1());...

2018-05-30 19:17:38 113

原创 javascript--12---作用域

作用域什么是作用域作用：对代码的一个读写操作域：空间范围 js能实现的一个范围<script> console.log(a); var a =1; </script>结果是undefined没有声明为什么会报undefined？首先预解析找到a 为undefined 执行代码 =改变变量的值但是console在等号之前所以结果是 undef...

2018-05-30 19:16:52 105

原创 javascript--9 奇怪的字符串和数值 while

var str = new String("123"); console.log(str);结果是string{} 类型是对象var str = "123"; console.log(str); console.log(str[0]);结果是 123 1除了以typeof 进行分类以外还能根据基本类型/引用类型基本包装类型进行分类str在进行 []语法或者for循环的时...

2018-05-30 19:15:31 141

原创 javascript--8 函数

函数的声明和函数的表达式函数的声明function fn(){}这是函数声明带有名字的是具名函数声明后面不需要加分号函数在声明的时候并没有执行，只是把内部作为一块存起来当调用时候执行函数的执行：fn(); 采用函数名加() 执行不分场合，可以放在函数声明之前可以在函数声明之后在函数声明之后不能加() 比如function fn(){alert(1);}();是会报错的匿名函数不能莫名奇妙...

2018-05-30 19:13:52 183

原创 git怎么用

git bash 出现了界面自报家门 git config --global user.name yyy 输入自己的名字按enter键输入邮箱 git config --global user.email ...清屏 clear本地完成仓库的创建cd c:进入c盘ls查看文件夹里装的内容ll除了可以看见文件夹外还能看见文件日期文件属于谁文件权限ll -a比详情更详细的详情出现./ ../...

2018-05-30 19:11:15 527

原创 3.html--块级元素与行内元素

图片选项卡从大到小从外到里从简单到复杂学习技巧what 是什么when 什么时候用where 什么地方how 怎么用dispalyblock 块级元素div h p ul li独占一行支持宽高没有设置宽度的时候默认宽度为父级100%支持margin padding 支持css样式inline 行内元素span a em默认由内容撑开宽高排成一行不支持设置宽度高度不支持垂直方向的margin 支...

2018-05-30 08:33:21 130

原创 2.html-div盒子模型

div盒子模型div标签是划分标签、分区标签可以放置宽度高度及各类css样式边框线border:1px solid red分别为边框的宽度边框样式边框颜色分别写：border-width border-color border-style border-topborder-stylesolid 实线dotted 点线dashed 虚线double 双线小三角设置宽度0 高度0 边框其他的...

2018-05-30 08:32:19 2109

原创 1--html基础

html的特点html标签是由尖括号包围的关键词标签中的第一个标签是开始标签第二个是结束标签通常是成对存在，也有是单独存在伴随着有属性和属性值css样式css的注释/**/css层叠样式：后面的样式会把前面的样式覆盖，是网页化妆师三种写法 1 是内部样式2外部样式 3标签内样式javascript是操作html页面响应用户操作验证传输数据标题标签<h1>``<h2>``...

2018-05-30 08:30:57 166

原创 javascript14--classlist

classlist<style> body,dl,dd,p,h1,h2,h3,h4,h5,h6{margin:0;} ol,ul,li{margin:0;padding:0;list-style:none;} img{border:none;vertical-align:top;} .box{ width:100px ; heig...

2018-05-22 16:44:18 352

原创案例 ---点亮星星

步骤一：实现鼠标移入左边的星星点亮右边的星星熄灭文字发生改变步骤二：实现鼠标移出星星熄灭文字发生改变步骤三：实现点击后左边星星点亮右边星星熄灭文字发生改变移出鼠标还是左边星星点亮右边星星熄灭分析步骤可知点击效果和移入效果一样，这样点击效果不用写，只写移入效果只是点击鼠标后移出鼠标后保存了状态即移出事件和移入事件一样只是取的值不同分为点...

2018-05-20 09:02:17 1583

原创 javascript 第七天---运算符

运算符+ - / % **在加号任意一侧出现了字符串的时候是字符串拼接% 是取余数 var a =7;a =a%2 console.log(a);结果是1，即7除2的余数** 平方赋值运算= += -= *= /= %= **=var a = 7;a+=7代表意思是 a=a+7 算数运算不存在分数<body> <div id="box"> <p cl...

2018-05-15 14:22:00 172

原创 javascript第六天----for循环

js是什么语法本身---变量---数据类型--控制结构DOM ---文档对象---查找元素---添加内容---修改标签属性---自定义属性BOM alert前端主要是对文档的增删改查伪元素的获取:: first-letter 特殊样式添加到首字母::first-line 特殊样式加到首行 :: before 在元素之前插入：：after 在元素之后插入伪元素是css渲染的并不存在与我们的do...

2018-05-15 14:20:44 169

原创 javascript--第五天---获取对象的其他方式

单个对象：var box = document.getElementsById("box");console.dir(oBox);//打印对象详情 var wrap = document.querySelector("#box .wrap"); 不兼容ie7及一下浏览器多个对象集合：需要通过【序号】来获取对应的标签节点，即便只有一个document.getElementsByClassName()...

2018-05-15 14:19:32 157

原创 javascript第四天------函数和函数里面的this关键字 if判断

声明变量的两种方式varfunction是专门用来声明函数function fn(){}其中fn是函数的名字，后面一定要跟().函数也叫方法，只有函数后面才加（）函数的作用：当代码需要重新利用时，用函数封装，执行函数就能达到效果。{}里放的是业务逻辑，{}之间可以换行，但是（）不要换行函数声明权重高，就算函数使用在声明之前，也能执行。function fn(){console.log( "大家好...

2018-05-15 14:18:28 764

原创 javascript第三天---标签内的属性和数组

操作标签内的样式<div id="box" style="width:100px;height: 100px;background: red;"></div> <script type="text/javascript"> var oBox = document.getElementById('box'); oBox.style ="bo

2018-05-15 14:17:04 542

原创 javascript 第二天---数据类型

代码的执行顺序如果js代码写在内容之前比如 <script>document.getElementById("box").onclick = function(){alert(456); }</script> <div id="box">123</div> 就会报错出现cannot et property onclik of null意思是不能找到元...

2018-05-15 14:15:49 148

原创 javascript 第一天-----js是什么

# js代码需要注意什么1. js严格区分大小写2. 必须在英文输入法状态下输入【unvalid token】符号错误3. 每个代码结束必须加;4. 单行注释用// 代码块用/**/# 变量命名的规范```var a = 123;a=145;```1. var是声明 a是变量名，使用var来表示有个变量要被声明，2. 后面的等号表示把··赋值给了a ，会被覆盖 3. 当我...

2018-05-15 14:14:31 112

原创 background背景的写法

background：background-image：背景图片的路径：url("")background-size:背景图片的尺寸。这里我想详细讲讲尺寸的几种写法背景图片的大小有两个值，一个值是宽，一个值是高，一px用像素代表，如果一个值代表宽，浏览器会自动按照原本图片比例计算出高，如果没有按图片原本比例写尺寸，随便写两个值，图片可能失真变形。如果数值代表高，写法为background-size...

2018-04-30 12:31:28 5416

原创模拟写官网时候怎么下载网页图片

方法一：在谷歌里安装插件可以通过百度下载安装方法二：ctrl+s适用于模拟移动端官网，以魅族为例，首先打开魅族官网，然后f12，点击之后快捷键ctrl+s保存图片方法三：直接手动抠图首先f12,然后点击，之后鼠标放在想要扣的图片上，右边会对应出现图片路径，之后鼠标右键点在图片路径上，出现open in new tab,选择这个，然后会跳转新的网页显示图片，右键另存为，就可以保存图片。如果要扣的是背...

2018-04-29 22:49:24 223

空空如也

空空如也