- 博客(15)
- 收藏
- 关注
RSS订阅原创 N06 js学习笔记 JSON
N06 js学习笔记 JSONJSONJS中的对象只有JS自己认识，其他的语言都不认识JSON就是一个特殊格式的字符串，这个字符串可以被任意的语言所识别，并且可以转换为任意语言中的对象，JSON在开发中主要用来数据的交互- JSONJavaScript Object Notation JS对象表示法JSON和JS对象的格式一样，只不过JSON字符串中的属性名必须加双引号其他的和JS语法一致JSON分类：对象 {}数组 []JSON中允许的值：字符串数值布尔
2020-07-18 21:18:47
96
原创 t09 js小练习 实现图片轮播
t09 js小练习 实现图片轮播分析图片轮播就是改变ul的位置，类似于将ul向左拖拽一个div的长度先实现按导航栏链接切换再实现自动切换步骤设置页面布局，呈现如下状态设置导航栏布局，使其位于图片上，且位置居中实现点击超链接，切换图片，并且超链接颜色改变实现自动轮播在点击导航栏切换图片时，要关闭自动轮播代码尚硅谷李立超老师index.html<!DOCTYPE html><html> <head> <meta chars
2020-07-18 19:23:15
126
原创 t08 小练习 div移动（利用定时器解决开头卡顿问题）
t08 小练习 div移动（利用定时器解决开头卡顿问题）功能方向键控制div移动利用定时器解决长按方向键移动的第一下卡顿的问题代码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>div移动（利用定时器解决开头卡顿问题）</title> <style type="text/css"> #box1{ width: 1
2020-07-18 14:00:06
107
原创 t07 小练习 图片自动切换
t07 小练习 图片自动切换功能点击开始按钮，图片开始轮播点击停止按钮，图片停在当前图片代码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>图片自动切换</title> <style type="text/css"> img{ width: 450px; height: 400px; } <
2020-07-18 13:40:35
94
原创 N05 js 学习笔记 BOM
N05 js 学习笔记 BOMBOM浏览器对象模型BOM可以使我们通过JS来操作浏览器在BOM中为我们提供了一组对象，用来完成对浏览器的操作BOM对象Window—代表的是整个浏览器的窗口，同时window也是网页中的全局对象Navigator— 代表的当前浏览器的信息，通过该对象可以来识别不同的浏览器Location— 代表当前浏览器的地址栏信息，通过Location可以获取地址栏信息，或者操作浏览器跳转页面History— 代表浏览器的历史记录，可以通过该对象来操作浏览器
2020-07-17 23:58:54
109
原创 t06 dom 小练习 div随方向键移动
t06 dom 小练习 div随方向键移动功能实现按动方向键，页面中的div块会上下左右移动按下ctrl键之后加速代码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #box1{ width: 100px; height: 100px;
2020-07-17 23:20:30
61
原创 t05 dom 小练习 拖拽
t05 dom 小练习 拖拽功能实现鼠标按住页面内的元素拖动代码分析鼠标在元素上按下鼠标移动（此时鼠标时按下状态），鼠标移动时，元素跟着移动松开鼠标，元素不再跟随鼠标移动，停在松开鼠标的位置<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>拖拽</title> <style type="text/css"> #bo
2020-07-17 21:18:04
48
原创 N04 js学习笔记 事件的传播
N04 js学习笔记 事件的传播事件的传播关于事件的传播网景公司和微软公司有不同的理解微软公司认为事件应该是由内向外传播，也就是当事件触发时，应该先触发当前元素上的事件， 然后再向当前元素的祖先元素上传播，也就说事件应该在冒泡阶段执行。网景公司认为事件应该是由外向内传播的，也就是当前事件触发时，应该先触发当前元素的最外层的祖先元素的事件，然后在向内传播给后代元素W3C综合了两个公司的方案，将事件传播分成了三个阶段1. 捕获阶段在捕获阶段时从最外层的祖先元素，向目标元素进行事件的捕获，但是
2020-07-17 19:33:20
60
原创 N03 js学习笔记 事件的绑定
1. 使用 对象.事件 = 函数 的形式绑定响应函数它只能同时为一个元素的一个事件绑定一个响应函数，不能绑定多个，如果绑定了多个，则后边会覆盖掉前边的2.addEventListener()方法通过这个方法也可以为元素绑定响应函数参数：1. 事件的字符串，不要on2. 回调函数，当事件触发时该函数会被调用3. 是否在捕获阶段触发事件，需要一个布尔值，一般都传false注意使用addEventListener()可以同时为一个元素的相同事件同时绑定多个响应函数，这样当事件被触发
2020-07-17 16:11:50
52
原创 N02 js学习笔记 事件的委派
事件的委派 指将事件统一绑定给元素的共同的祖先元素，这样当后代元素上的事件触发时，会一直冒泡到祖先元素从而通过祖先元素的响应函数来处理事件。事件委派是利用了冒泡，通过委派可以减少事件绑定的次数，提高程序的性能作用为每一个超链接都绑定一个单击响应函数，这种操作比较麻烦，而且这些操作只能为已有的超链接设置事件，而新添加的超链接必须重新绑定我们希望，只绑定一次事件，即可应用到多个的元素上，即使元素是后添加的 我们可以尝试将其绑定给元素的共同的祖先元素小知识点target- ev
2020-07-17 15:12:25
93
原创 N01 js学习笔记 冒泡
T01 学习笔记 冒泡事件的冒泡（Bubble）所谓的冒泡指的就是事件的向上传导，当后代元素上的事件被触发时，其祖先元素的相同事件也会被触发在开发中大部分情况冒泡都是有用的,如果不希望发生事件冒泡可以通过事件对象来取消冒泡取消冒泡可以将事件对象的cancelBubble设置为true，即可取消冒泡event.cancelBubble = true;...
2020-07-17 14:43:00
54
原创 t04 dom 小练习 div块随鼠标移动
t04 dom 小练习 div块随鼠标移动代码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #box1{ width: 100px; height: 100px; background-color: red; /* * 开
2020-07-17 14:07:39
53
原创 t03 dom 小练习 显示固定区域鼠标坐标
t03 dom 小练习 显示固定区域鼠标坐标结果图功能介绍当鼠标在上方的框中移动时，下方的框会显示鼠标的横纵坐标表。代码完整代码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>显示鼠标坐标</title> </head> <style type="text/css"> *{ margin: 0;
2020-07-17 13:36:27
72
原创 t02 dom 小练习 员工信息增删
t02 dom 小练习 员工信息增删结果图示页面显示删除后添加后功能介绍显示页面点击Delete，删除此行点击提交，员工信息将添加到上面的表格中代码1. 页面布局，body中的内容<body> <div id="box1"> <table id="tb"> <tr> <th>name</th> <th>email</th> <t
2020-07-17 13:10:24
133
原创 t01 DOM 小练习 全选练习
t01 DOM 小练习1 全选练习结果图功能介绍点击全选按钮时，足球、篮球、跑步、跳绳四个多选框 和 全选/全不选 会全部勾选上点击全不选按钮时，足球、篮球、跑步、跳绳四个多选框 和 全选/全不选 会全部不被勾选点击反选按钮时，已经勾选了的取消勾选，未勾选的勾选上全选/全不选 勾选状态要和足球、篮球、跑步、跳绳四个多选框的全部勾选状态一致（即全选/全不选 可以控制四个多选框是否全选；反过来，四个多选框是否全选也会控制全选/全不选 的勾选状态）点击提交按钮时，对话框弹出处于勾选状态的运动
2020-07-17 12:44:25
112
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人