自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(77)
  • 收藏
  • 关注

原创 vscode快捷方式失效问题

问题:vscode突然快捷方式变白,点击快捷方式弹出“该快捷方式所指向的项目code.exe已经更改或移动”解决方式:去vscode的安装目录发现多了一个—文件夹这样一来,code.exe目录就变了解决方式:把—文件夹里面所有文件夹复制到vscode文件夹下,再删掉—文件夹即可...

2021-09-18 17:58:43 5541 9

原创 webstorm操作集合

file–>settings搜browser第2步点一下chrome作用是让他去到列表的第一行,然后在第3步选择默认浏览器为列表中的第一个

2019-11-20 15:10:09 298

原创 点击某个按钮, 提示"点击的是第n个按钮"

需求: 点击某个按钮, 提示"点击的是第n个按钮"<body><button>测试1</button><button>测试2</button><button>测试3</button><script type="text/javascript"> var btns = document.g...

2019-11-16 03:18:16 379

原创 疑问

<script type="text/javascript"> console.log('gb: '+ i) var i = 1 foo(1) function foo(i) { if (i == 4) { return } console.log('fb:' + i) ...

2019-11-15 14:52:31 179

原创 BOM对象

一.BOM浏览器对象模型BOM可以使我们通过JS来操作浏览器在BOM中为我们提供了一组对象,用来完成对浏览器的操作二.BOM对象Window代表的是整个浏览器的窗口,同时window也是网页中的全局对象Navigator代表的当前浏览器的信息,通过该对象可以来识别不同的浏览器Location代表当前浏览器的地址栏信息,通过Location可以获取地址栏信息,或者操作...

2019-11-12 02:28:59 218

原创 使div可以根据不同的方向键向不同的方向移动

元素想动一定要开启定位!!!!<style type="text/css"> #box1{ width: 100px; height: 100px; background-color: red; position: absolute; } </style> <script type="t...

2019-11-11 22:19:56 455

原创 键盘事件

一.键盘事件键盘事件一般都会绑定给一些可以获取到焦点的对象或者是document1.onkeydown:按键被按下对于onkeydown来说如果一直按着某个按键不松手,则事件会一直触发当onkeydown连续触发时,第一次和第二次之间会间隔稍微长一点,其他的会非常的快这种设计是为了防止误操作的发生。2.onkeyup:按键被松开<script type="text/java...

2019-11-11 22:16:30 1152

原创 node整合webstorm

一般情况下会自动配置的。

2019-11-09 02:04:36 232

原创 Windows注册svn服务器的服务

SVN服务器(VisualSVN Server)启动这事非常麻烦,什么命令行启动啊,然后命令行又不能关啥的,总之非常非常麻烦,然后又不懂。。。。。所以为SVN注册一个服务,是一个非常明智的办法,创建好之后可以设置为自启动,这样就不用管它启没启动了。注册Windows服务:将SVN服务端程序注册为Windows服务,就可以让SVN服务随系统一起启动,克服了命令行方式的不足。注册Window...

2019-11-08 21:37:46 843

原创 事件的传播

事件的传播一.关于事件的传播网景公司和微软公司有不同的理解微软公司认为事件应该是由内向外传播,也就是当事件触发时,应该先触发当前元素上的事件,然后再向当前元素的祖先元素上传播,也就说事件应该在冒泡阶段执行。网景公司认为事件应该是由外向内传播的,也就是当前事件触发时,应该先触发当前元素的最外层的祖先元素的事件,然后在向内传播给后代元素二.W3C综合了两个公司的方案,将事件传播分成了三个阶...

2019-11-08 00:06:20 265

原创 事件的委派

    这里为每一个超链接都绑定一个单击响应函数,并且添加的新的超链接也具有单击响应函数,按之前那种循环太麻烦了,还要给添加的超链接再绑定。<body> <button>添加超链接</button> <ul> <li><a href="javascript:;" c...

2019-11-07 17:30:34 449

原创 事件冒泡

事件的冒泡(Bubble)所谓的冒泡指的就是事件的向上传导,当后代元素上的事件被触发时,其祖先元素的相同事件也会被触发在开发中大部分情况冒泡都是有用的,如果不希望发生事件冒泡可以通过事件对象来取消冒泡是看代码,从里往上冒泡,要想取消冒泡,是设置two不冒泡一.有用的冒泡<style> #one{ width: 50px; height...

2019-11-07 16:41:31 1087

原创 div跟随鼠标移动

一.先了解元素与鼠标的坐标原点都是谁

2019-11-07 15:20:16 444

原创 在one上移动,two里显示鼠标坐标

<style> #one{ width: 200px; height: 200px; border: 1px solid black; margin-bottom: 20px; } #two{ width: 200px; height: 50px; b...

2019-11-07 14:04:59 118

原创 循环与响应函数的执行顺序

总结:for循环会在页面加载完成之后立即执行而响应函数在被点击时才执行当响应函数执行时,foe循环早已执行完毕一.循环绑定事件点击每个li打印除相应的序号<body><ul> <li>11</li> <li>22</li> <li>33</li></ul&g...

2019-11-06 14:36:14 300

原创 对象方法

1.数组方法reverse()- 可以用来反转一个数组,它会对原数组产生影响concat()- 可以连接两个或多个数组,它不会影响原数组,而是新数组作为返回值返回join()- 可以将一个数组转换为一个字符串- 参数:需要一个字符串作为参数,这个字符串将会作为连接符来连接数组中的元素如果不指定连接符则默认使用,逗号sort()- 可以对一个数组中的内容进行排序,默认是按照Un...

2019-11-04 15:45:01 261

原创 Date对象

在JS中使用Date对象来表示一个时间1.创建一个Date对象如果直接使用构造函数创建一个Date对象,则会封装为当前代码执行的时间var d = new Date();2.创建一个指定的时间对象需要在构造函数中传递一个表示时间的字符串作为参数日期的格式 月份/日/年 时:分:秒var d2 = new Date(“2/18/2011 11:10:30”); /* * ...

2019-10-31 21:53:52 247

原创 css注意事项

注意点:1.position:absolute或者float:left/right打内部把元素转换成inline-block元素2.a标签是行级元素,不能设置宽高,要想能设置宽高则设置为块级或行块级元素3.行级元素只能嵌套行级元素;块级元素可以嵌套任何元素特例:p标签不能嵌套块级元素(就这一个特殊)4.background缩写样式背景颜色background-color背景图片bac...

2019-10-29 15:45:41 114

原创 js注意点

1.var div=getElementsByTagName(‘div’)得到的是数组后面一定要加标号说明取其中的第几个元素!!!正确的写法:var div=document.getElementsByTagName(‘div’)[0];

2019-10-28 23:33:22 83

原创 事件的绑定

一.绑定事件事件本来就存在,绑定的是事件处理函数。比如:<div>111</div>这也可以点击,没有变化只是因为没有绑定事件处理函数。二.onclick是on+事件类型三.绑定事件处理函数方式1.element.onxxx=function(event){}兼容性很好,但是一个元素的同一个事件上只能绑定一个处理程序基本等同于写在HTML行间上。将ev...

2019-10-28 23:32:43 192

原创 定时调用和延时调用

定时器,三分钟停止<body> 分:<input type="text" value="0"> 秒:<input type="text" value="0"><script type="text/javascript"> var sec=document.getElementsByTagName('input')[1];...

2019-10-28 20:19:42 820

原创 setInterval定时取消

计时器,到一分钟停止<body> 计时器:<span></span><script type="text/javascript"> var i=0; function time() { var date=new Date(); var span=document.getElementsByT...

2019-10-28 19:48:36 1554

原创 初识js

1.例一<body><div></div><script type="text/javascript"> var div=document.getElementsByTagName('div')[0]; //一定要加标号,getElementsByTagName('div')得到的是数组 div.style.width='10...

2019-10-28 19:42:36 103

原创 斐波那契数列

<body><script type="text/javascript">// f s t// 1 1 2 3 5 8 输出第n项// f s t var n=parseInt(prompt('input')); var first=1, second=1, third; if(n>...

2019-10-26 01:36:21 128

原创 点击一次变色,再点击变回原色

注意思路<body><div></div><script type="text/javascript"> var div=document.getElementsByTagName('div')[0]; div.style.width='100px'; div.style.height='100px'; div....

2019-10-24 14:46:47 4273 2

原创 文本类元素

带有inline即行级元素和行块级元素属于文本类元素,具有文本的属性,能被分隔符分割。例一:<style> img{ width: 100px; height: 100px; }</style><body><img src="css2/image/pig.jpg"><img src="...

2019-10-23 22:46:08 349

原创 体验margin值auto的作用

<style> .wrapper{ width: 600px; height: 600px; border: 1px solid black; } .content{ width: 400px; height: 500px; background-color: gre...

2019-10-23 22:32:12 285

原创 一些报错解决

1.idea报错:Method definition shorthands are not supported by current JavaScript version解决办法:打开 File -> Settings -> Languages & Frameworks -> Javascript更改JavaScript版本为ECMAScript 6...

2019-10-23 22:10:39 173

原创 超链接背景图片

<style> a{ display: inline-block; width: 250px; height: 150px; background-image: url("https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=1728444903,291...

2019-10-23 22:06:02 1454

原创 背景图片

一.背景图片完全铺满容器方法:背景图片宽高等于容器宽高<style> div{ width: 400px; height: 400px; border: 1px solid black; background-image: url("../image/pig.jpg"); background-...

2019-10-23 17:25:47 169

原创 文字溢出

文字溢出容器,要打点展示多行文本目前没有什么好的技术,只能告诉后端我这最多能传多少文字;而单行文本有三件套来实现打点展示。一.单行文本文字溢出现象<style> p{ width:500px; border: 1px solid black; height: 20px; line-height: 20px...

2019-10-23 16:36:17 133

原创 写css代码的思维

一.利用通用选择器,写出共有属性,反正后面可以修改(后面会覆盖前面的值)*{ margin: 0; padding: 0; color: #424242; font-family: Arial; /*通用字体*/ }二.要经常有全局与局部的思维作用于所有a标签 a{ text-decoration: no...

2019-10-23 15:45:51 101

原创 clear属性

clear属性一.说明clear 属性规定元素的哪一侧不允许其他浮动元素。二.取值left 在左侧不允许浮动元素。right 在右侧不允许浮动元素。both 在左右两侧均不允许浮动元素。none 默认值。允许浮动元素出现在两侧。inherit 规定应该从父元素继承 clear 属性的值。通常取值为both注意:使用该属性的元素必须是块级元素(block或inline-block...

2019-10-23 13:51:41 1049

原创 伪类和伪元素区别

一.伪类二.伪元素

2019-10-23 11:01:42 188

原创 包裹浮动元素

包裹浮动元素<style> .wrapper{ border: 1px solid black; } .content{ width:100px; height: 100px; background-color: black; color: #fff; float:...

2019-10-23 01:29:49 235

原创 float属性

float属性注:浮动元素产生了浮动流       所有产生浮动流的元素,块级元素看不到它们;      产生了bfc的元素和文本类属性(inline)的元素以及文本都能看到浮动元素。<style> .wrapper{ wid...

2019-10-23 01:24:37 8929

原创 行级元素、块级元素

元素分类行间元素(inline):span, strong, em, a, del块级元素(block):div, p, ul, ol, li, form, address行块级元素(inline-block):img1.行间元素:内容决定元素所在位置,不可以通过css改变宽高。<style> .one{ width: 100px; h...

2019-10-23 01:00:15 200

原创 两个经典bug

一.margin塌陷原理:父子嵌套元素在垂直方向的margin,父子元素是结合在一起的,他们两个的margin会取其中最大的值。正常情况下,父级元素应该相对浏览器进行定位,子级相对父级定位。但由于margin的塌陷,父级相对浏览器定位.而子级没有相对父级定位,子级相对父级,就像坍塌了一样。<style> .wrapper{ width:200px; ...

2019-10-22 19:22:56 259

原创 两栏布局

<style> .one{ width:400px; height: 200px; background-color: green; /*float: left;或者position: absolute;都可以*/ position: absolute; opacity: 0.25;...

2019-10-22 18:30:32 85

原创 伪类选择器

伪类选择器伪类选择器就是对元素处于某种状态下进行样式的1.锚伪类—超链接伪类(不止是a标签,其他标签也可以)在支持 CSS 的浏览器中,链接的不同状态都可以不同的方式显示,这些状态包括:活动状态,已被访问状态,未被访问状态,和鼠标悬停状态。a:link {color: #FF0000} /* 未访问的链接 */a:visited {color: #00FF00} /* 已访问的链接 *...

2019-10-22 17:51:56 247

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除