勋章
我关注的人
技术能力
暂时未有相关云产品技术能力~
暂无个人介绍
-
发表了文章 2023-01-16
浅谈Ajax请求中的GET,POST,PUT,DELETE,PATCH,OPTIONS
浅谈Ajax请求中的GET,POST,PUT,DELETE,PATCH,OPTIONS 在日常的前后端交互，数据请求中最长用的就是Ajax，当然在面试时也经常会被问道请求的方式有哪些？分别什么不同？一般我们都会回答GET请求和POST请求，但其实在后端配置接口时，请求方式不仅这两种，还会有PUT，DELETE,PATCH等，当然我们在开发的时候偶尔也会遇到接口要求使用这几种方式进行请求，下面我们就来讲一讲这几种方式分别有什么不同。 首先先要了解http定义与服务器进行交互的方式，其中基本的有GET,POST,PUT,DELETE，PATCH是后增的方式。同时还要知道URL代表的是 统一资源
-
发表了文章 2023-01-16
史上最全HTML实体字符整理
HTML字符实体 做开发的小伙伴们都知道，HTML有一些预留字符，浏览器在解析时不能正确的显示，这个时候我们就需要使用字符实体进行替换。同时，有一些键盘上找不见的符号我们也可使使用字符实体进行替换，下面是我整理的几类我们经常遇到的字符。 1.常见的HTML预留字符 字符 实体编号 实体名称 描述 空格   < 小于号 < < | 大于号 | > | > & | 和号 | & | & " | 引号 | " | " ’ | 撇号 | ' (IE不支持) | ' ￠ | 分 | ¢ | ¢ £ |
-
发表了文章 2023-01-16
HTML5的学习之新增元素
HTML5的学习之新增元素 这篇文章学习一下HTML5新增的元素及浏览器的兼容 标签 描述 <article> 定义页面独立的内容区域。 <aside> 定义页面的侧边栏内容。 <bdi> 允许您设置一段文本，使其脱离其父元素的文本方向设置。 <command> 定义命令按钮，比如单选按钮、复选框或按钮 <details> 用于描述文档或文档某个部分的细节 <dialog> 定义对话框，比如提示框 <summary> 标签包含 details 元素的标题 <figure> 规定独立的流内容（图像、图
-
发表了文章 2023-01-16
HTML5的学习之表单元素
HTML5的学习之表单元素 这篇博客我们继续对HTML5进行学习,主要讲解HTML5的表单元素相关的内容。 1.input元素新增的类型 type类型 描述 color 选色板 month 月份 week 周 date 日期 datetime 多数不兼容 datetime-local 日期加时间 time 时间 email 检测邮箱地址 number 数字 range 范围 调节音量 进度条 search 搜索 tel 电话 不支持 url 地址 检测 HTML代码： <form> <input type="text" autofocus placehol
-
发表了文章 2023-01-16
HTML5的学习之媒体元素
HTML5的学习之媒体元素 前几篇博客我们将HTML5中的canvas画布元素进行了讲解，接下来开始学习其他的HTML5新元素。这篇就博文主要讲解HTML5中的媒体元素 <video> 和 <audio> 。 HTML代码： <!-- 视频 --> <video src="../js练习/英雄联盟.mp4" controls autoplay></video> <video controls> <source src="../js练习/英雄联盟.mp4" type="
-
发表了文章 2023-01-16
HTML5的学习之canvas画布(五)
HTML5的学习之canvas画布 canvas其他剩余的方法和属性。 转换 方法 描述 scale() 缩放当前绘图至更大或更小。 rotate() 旋转当前绘图。 translate() 重新映射画布上的 (0,0) 位置。 transform() 替换绘图的当前转换矩阵。 setTransform() 将当前转换重置为单位矩阵。然后运行 transform()。 图像绘制 方法 描述 drawImage() 向画布上绘制图像、画布或视频。 createImageData() 创建新的、空白的 ImageData 对象。 getImageData() 返回 ImageData 对象，
-
发表了文章 2023-01-16
HTML5的学习之canvas画布(四)
HTML5的学习之canvas画布 这篇博客继续学习canvas的文字相关属性和方法。 属性 属性 描述 font 设置或返回文本内容的当前字体属性。 textAlign 设置或返回文本内容的当前对齐方式。 textBaseline 设置或返回在绘制文本时使用的当前文本基线。 方法 方法 描述 fillText() 在画布上绘制"被填充的"文本。 strokeText() 在画布上绘制文本（无填充）。 measureText() 返回包含指定文本宽度的对象。 使用canvas绘制艺术字 HTML代码： <canvas id="my_canvas"&
-
发表了文章 2023-01-16
HTML5的学习之canvas画布(三)
HTML5的学习之canvas画布 上篇博客主要讲解了canvas线条有关的一些属性和方法。这篇文章我们继续学习canvas有关图形绘制的方法。 1.矩形 方法 描述 rect() 创建矩形。 fillRect() 绘制"被填充"的矩形。 strokeRect() 绘制矩形（无填充）。 clearRect() 在给定的矩形内清除指定的像素。 2.圆形 方法 描述 arc() 创建弧/曲线（用于创建圆形或部分圆）。 arcTo() 创建两切线之间的弧/曲线。 ellipse() 创建椭圆。 3.路径 方法 描述 fill() 填充当前绘图（路径）。 stroke() 绘制已定
-
发表了文章 2023-01-16
HTML5的学习之canvas画布（二）
HTML5的学习之canvas画布 这篇文章我么继续学习canvas画布。学习学习canvas画布线条的颜色，渐变，阴影等属性和方法。 属性 1.颜色属性 属性 描述 fillStyle 设置或返回用于填充绘画的颜色、渐变或模式。 strokeStyle 设置或返回用于笔触的颜色、渐变或模式。 2.阴影属性 属性 描述 shadowColor 设置或返回用于阴影的颜色。 shadowBlur 设置或返回用于阴影的模糊级别。 shadowOffsetX 设置或返回阴影与形状的水平距离。 shadowOffsetY 设置或返回阴影与形状的垂直距离。 3.线条样式属性 属性 描述 lineC
-
发表了文章 2023-01-16
HTML5的学习之canvas画布(一)
HTML5的学习之canvas画布 前面几篇博客我们一直在讲如何使用canvas绘制一下图片，但是没有讲过canvas如何使用，都有哪些属性，方法等。今天我们就来讲一讲canvas的有关属性和方法。 HTML5 标签用于绘制图像（通过脚本，通常是 JavaScript）。 元素本身并没有绘制能力（它仅仅是图形的容器），必须使用脚本来完成实际的绘图任务。 getContext() 方法可返回一个对象，该对象提供了用于在画布上绘图的方法和属性。 接下来我们来学习一下这个对象的属性和方法，用于在画布上绘制文本、线条、矩形、圆形等等。 HTML代码： <
-
发表了文章 2023-01-16
教你如何用Canvas绘制整身的哆啦A梦
教你如何用Canvas绘制整身的哆啦A梦 上牌你文章我们说到了如何使用canvas绘制哆啦A梦，但当时只是绘制了哆啦A梦的头部，之后有学员留言说可不可以教大家绘制整身的哆啦A梦，想了想，决定安排一下。如图： 在这里插入图片描述 HTML代码： <canvas id="my_canvas"></canvas> <canvas id="my_canvas2"></canvas> 1 2 CSS代码： * { margin: 0; } #my_canvas {
-
发表了文章 2023-01-16
教你如何利用canvas画布绘制哆啦A梦
订阅专栏 教你如何利用canvas画布绘制哆啦A梦 最近一直在练习使用canvas画布标签，今天教大家如何使用canvas画布绘制哆啦A梦。如图： HTML代码： <canvas id="my_canvas"></canvas> 1 CSS代码： canvas { display:block; margin:0 auto; background: pink } 1 2 3 4 5 JavaScript代码： var oCanvas = document.getEleme
-
发表了文章 2023-01-11
详细解析JavaScript中的全局属性和方法
详细解析JavaScript中的全局属性和方法 今天来补充JavaScript中的最后一部分内容，JavaScript中的全局属性和方法(函数)。 1.全局属性 // 属性 // Infinity 代表正的无穷大的数值。 // 在Javascript中，超出 1.7976931348623157E+103088 的数值即为Infinity，小于 -1.7976931348623157E+103088 的数值为无穷小。 var num1 = 1.7976931348623157E+103088; var num2 = -1.79769313486
-
发表了文章 2023-01-11
详细解析Ajax的使用之向服务器发送GET请求
详细解析Ajax的使用之向服务器发送GET请求 上篇文章讲的如何使用Ajax发送get请求，这篇文章说如何使用Ajax发送post请求。 HTML代码： <h1>ajax的post请求</h1> <button id="btn">发送请求</button> 1 2 JavaScript代码： var oBtn = document.getElementById("btn"); // 1.初始化请求对象 var xhr; if (window.XMLHttpRequest) { xhr = new XML
-
发表了文章 2023-01-11
详细解析Ajax的使用之向服务器发送GET请求
详细解析Ajax的使用之向服务器发送GET请求 前面一篇博客我们讲到了如何使用form表单像服务器发送请求，但是请求方式是同步的，效率太低，现在我们讲一下如何使用Ajax的技术向服务器发送异步请求。 HTML代码： <h1>ajax的get请求</h1> <button id="btn">获取数据</button> <p>姓名：<span id="user"></span></p> <p>年龄：<span id="age"></span></p> 1 2 3 4 JavaScript代码： var oBtn =
-
发表了文章 2023-01-11
浏览器同步发送请求之form表单提交数据
浏览器同步发送请求之form表单提交数据 上篇就文章我们讲到了同步和异步的区别，这次主要说一下在网页中如何提交同步的请求，答案就是通过form表单提交请求。 1.GET请求 HTML代码： <form action="get.php" method="get"> 账号：<input type="text" name="user"> <br> 密码：<input type="text" name="psw"><br> <input type="submit" value="登录"> </form> 1 2
-
发表了文章 2023-01-11
详细解析JavaScript的Ajax之同步和异步的区别
详细解析JavaScript的Ajax之同步异步的区别 博客整理到这里基本上JavaScript的初级知识就整理完了，现在我们来说一下看JavaScript的最后一个知识点——Ajax。 （Asynchronous Javascript And XML） 即异步 JavaScript 和 XML，一种创建交互式、快速动态网页应用的网页开发技术，无需重新加载整个网页的情况下，能够更新部分网页的技术。 1.同步和异步 首先我们先来分析一下JavaScript的中的同步和异步的区别。 同步就是调用某个内容时，调用方得等待这个调用返回结果才能继续往后执行。(期间不可以执行其他的命令)。如图：
-
发表了文章 2023-01-11
详细解析cookie，sessionStroage和localStroage的区别
详细解析cookie，sessionStroage和localStroage的区别 前面我们说到了JavaScript中的缓存对象，主要是cookie,sessionStroage和localStroage，今天我们来讲一下这三者之间的区别。 共同点 都是保存在浏览器端，且同源的。(所谓同源就是协议，域名，端口号相同)。 都是字符串类型的键值对。 区别 1.cookie HTTP Cookie简称cookie,在HTTP请求发送Set-Cookie HTTP头作为响应的一部分。通过name=value的形式存储 cookie的构成： 名称：n
-
发表了文章 2023-01-11
详解BOM的存储对象
详解BOM的存储对象 今天来讲一下BOM中的最后一部分内容，BOM的存储对象。在JavaScript中以前有cookie对象可以对一部分数据进行存储，但是安全性低，并且容量有限。所有就有了现在的BOM中的存储对象 sessionStroage 和 localstroage 对象。 HTML代码： <h1>02BOM的储存对象</h1> <h3>sessionStorage</h3> <button>setItem()</button> <button>getItem()</button> <button>removeItem()</button>
-
发表了文章 2023-01-11
JavaScript模拟列表跳转详情页面效果
JavaScript模拟列表跳转详情页面效果 上一篇文章我们讲到如何利用JavaScript中location对象的hash值的改变来实现商品列表跳转到详情页面的效果。然后有同学问我，说淘宝的是利用的"?id=****"效果实现的，现在我们来讲一下如何利用location的 search实现效果。如图： 1.列表页面HTML代码： <a href="01模拟详情页面.html?id=0" target="_blank"><img src="../0603/img/1.jpg" alt=""></a> <a href="01模拟详情页面.html?id=1" target=
-
发表了文章 2023-01-11
JavaScript通过改变location对象的hash属性实现相同页面显示不同详情内容的效果
JavaScript通过改变location对象的hash属性的应用 前面我们学到了BOM的Location对象，现在来讲一下实际的应用。通过改变hash属性获取不同的数据。 1.列表页面代码： <a href="10模拟详情页面.html#0" target="_blank">张三</a> <a href="10模拟详情页面.html#1" target="_blank">李四</a> <a href="10模拟详情页面.html#2" target="_blank">王五</a> <a href="10模拟详情页面.html#3" target="_b
-
发表了文章 2023-01-11
详细解析BOM中Location对象
详细解析BOM中Location对象 Location对象包含有关当前URL的信息。 // href 返回完整的URL console.log(location.href); // host 返回一个URL的主机名和端口 console.log(location.host); // hostname 返回URL的主机名 console.log(location.hostname); // port 返回一个URL服务器使用的端口号 console.log(location.port); // origin 源 返
-
发表了文章 2023-01-11
简单解析BOM中History对象
简单解析BOM中History对象 History 对象包含用户（在浏览器窗口中）访问过的 URL。 <button>back()</button> <button>forward()</button> <button>go()</button> 1 2 3 console.log(history); var aBtns=document.getElementsByTagName("button"); // 属性 // length 返回历史记录/列表中的网址数 console.log(histo
-
发表了文章 2023-01-11
简单解析BOM中Screen对象
简单解析BOM中Screen对象 Screen 对象包含有关客户端显示屏幕的信息。 console.log(screen); // 属性 // availHeight 返回屏幕的高度（不包括Windows任务栏） // availWidth 返回屏幕的宽度（不包括Windows任务栏） console.log(screen.availHeight,screen.availWidth); // height 返回屏幕的总高度 // width 返回屏幕的总宽度 console.log(screen.height,scree
-
发表了文章 2023-01-11
简单解析BOM中Navigator对象
简单解析BOM中Navigator对象 navigator对象包含了有关浏览器的信息。 console.log(navigator); // 属性 // appCodeName 返回浏览器的代码名 console.log(navigator.appCodeName); // appName 返回浏览器的名称 console.log(navigator.appName); // appVersion 返回浏览器的平台和版本信息 console.log(navigator.appVersion); // cookieEna
-
发表了文章 2023-01-11
BOM中window对象的方法之计时器
BOM中window对象的方法之计时器 前面讲到了window对象的弹窗方法，现在来讲一下计时器方法。 // setInterval(function(){},time,参数,参数) 按照指定的周期（以毫秒计）来调用函数或计算表达式。 var i=0; var timer=setInterval(function(){ i++; console.log(i); }, 1000); // clearInterval(定时器的名称) 取消由 setInterval() 设置的 timeout。 document.
-
发表了文章 2023-01-11
BOM中window对象的方法之弹窗
BOM中window对象的方法之弹窗 之前介绍了window对象的属性，接下来说一说window对象的方法。当然方法有好些，这里主要讲一下window对象的弹窗方法。 // alert() 显示带有一段消息和一个确认按钮的警告框。 window.alert("这是是一个警告框"); // confirm() 显示带有一段消息以及确认按钮和取消按钮的对话框。 返回值 true false var sure=window.confirm("确认要离开吗？"); console.log(sure); // prompt("提示文本"
-
发表了文章 2023-01-11
BOM中window对象的属性
BOM中window对象的属性 这篇博客主要介绍一下BOM中的window对象的属性。 HTML代码： <a href="http://www.baidu.com">百度一下</a> <iframe src="" frameborder="1" id="frame1" name="frame_1"></iframe> <iframe src="" frameborder="1" name="frame_2"></iframe> <iframe src="" frameborder="1" name="frame_3"></iframe> <ifra
-
发表了文章 2023-01-11
简单认识JavaScript的BOM对象
简单认识JavaScript的BOM对象 前面JavaScript中DOM的学习基本已经结束了。今天开始我们学习一下JavaScript中的BOM。 BOM(浏览器对象模型) Browser Object Model 所有有的浏览器都支持window对象， 浏览器的窗口 window对象是js的最高级 / 顶级对象。 所有js的全局对象, 变量, 函数 自动变成window对象的成员 全局变量相当于window对象的属性。 全局函数相当于window对象的方法。 a = 10; console.log(window.a);/
-
发表了文章 2023-01-11
利用Javascript制作轮播图最终版--滑动效果
JS最快速度制作滑动效果的轮播图 前面几篇博客一直在讲轮播图的制作，这篇博客是最终版，实现轮播图的滑动效果。如图： 在这里插入图片描述 HTML代码： <div class="box" id="box"> <ul class="min_box" id="banner"> <li class="banner"></li> <li class="banner"></li> <li class="banner"></li> <li class="banner"></li>
-
发表了文章 2023-01-11
利用JavaScript的控制图片的CSS位置实现轮播图功能
利用JavaScript的控制图片的CSS位置实现轮播图功能 上篇博客我们说到了如何给轮播图添加定时器效果，当然前面的两个轮播图功能实现都是通过改变图片的路径(图片名称取巧)实现的，有一定的局限性。今天说一说怎样通过改变位置实现轮播功能。效果如图： 在这里插入图片描述 HTML代码： <div class="box" id="box"> <ul class="min_box" id="banner"> <li class="banner"></li> <li class="banner"></li>
-
发表了文章 2023-01-11
如何用最简单的代码制作带定时器的轮播图
如何用最简单的代码制作带定时器的轮播图 前几天写了一篇有关轮播图制作的博客，但当时没有添加定时的效果，说白了就是没有自动轮播的效果，今天来说一下怎样添加自动轮播效果。如图： 在这里插入图片描述 HTML代码： <div class="box" id="box"> <img src="img/1.jpg" alt=""> <!-- <img src="img/1.jpg" alt=""> <img src="img/2.jpg" alt=""> <img src="img/3.jpg" alt=""> -->
-
发表了文章 2023-01-11
简单解析JavaScript的默认事件及如何阻止默认事件
简单解析JavaScript的默认事件及如何阻止默认事件 上篇文章就提到，在JavaScript中提到事件冒泡两个必不可少也要提的就是事件捕获和默认事件，现在来聊一聊什么是默认事件，及如何阻止默认事件。 1.什么是默认事件 顾名思义，默认事件就是默认执行的事件，比如 a标签，点击a标签，页面会自动跳转。如图： 在这里插入图片描述 HTML代码： <form action=""> <input type="submit" id="submit"> <input type="image" src="../../CSS/0421/car.jpg"
-
发表了文章 2023-01-11
简单解析事件捕捉
简单解析事件捕捉 上篇博客说到了事件冒泡，其实在JavaScript中，说到事件冒泡还有两个个不得不提的事件捕获和默认事件，我们先来说一下事件捕获。效果如下图： 在这里插入图片描述 HTML代码： <div class="box1"> <div class="box2"> <div class="box3"> <div class="box4"></div> </div> </div> </div> 1 2 3 4 5
-
发表了文章 2023-01-11
简单解析js的事件冒泡及如何取消事件冒泡
简单解析js的事件冒泡 1.什么是事件冒泡？ 以click点击事件为例。假如我们有一个多层结构标签。如下图，是4个div嵌套。每个div都有点击的监听事件，分别alert(“box4”),alert(“box3”),alert(“box2”),alert(“box1”)。当我们点击最里面的div时，点击事件开始传递。出现的效果是alert(“box4”)-alert(“box3”)-alert(“box2”)-alert(“box1”)。这就是事件冒泡阶段。效果如下： 在这里插入图片描述 HTML代码： <div class="box1"> <div clas
-
发表了文章 2023-01-11
JavaScript实现鼠标拖拽效果
JavaScript实现鼠标拖拽效果 前几篇博客一直在讲鼠标的移动事件相关的效果，今天再来讲一讲如何利用鼠标事件实现拖拽div块移动的效果。效果如图： 在这里插入图片描述 HTML代码： <div id="box"></div> 1 CSS代码： * { margin: 0; padding: 0; } #box { width: 200px; height: 200px; background: red
-
发表了文章 2023-01-11
JavaScript实现一串div跟随鼠标移动效果（幻影效果）
JavaScript实现一串div跟随鼠标移动效果 上一篇博文我们说到了利用JavaScript实现div块跟随鼠标移动的效果。现在来讲一个进阶版，实现一串div跟随鼠标移动效果，鼠标幻影效果。如图： 在这里插入图片描述 HTML代码： <div class="box"></div> <div class="box"></div> <div class="box"></div> <div class="box"></div> <div class="box"></div> <div class="box"></div> <div
-
发表了文章 2023-01-11
JavaScript实现div块跟随鼠标移动效果
JavaScript实现div块跟随鼠标移动效果 前面讲了这么多DOM事件有关的属性等，现在我们进行一些相关的练习，实现div块跟随鼠标移动效果，如图： 在这里插入图片描述 HTML代码： <div id="box"></div> 1 CSS代码： *{ margin: 0; padding: 0; } body{ width: 2000px; height: 2000px; } #box{ width: 200px; heigh
-
发表了文章 2023-01-11
详细区分offsetX，clientX，pageX，screenX，layerX和X的区别
详细区分DOM事件中鼠标指针的坐标问题 前面博客中我们讲解到了DOM事件的event对象，里边包含了鼠标事件的指针坐标属性。比如event.offsetX,event.clientX,event.pageX,event.screenX等等。现在我们来解析一下这些坐标属性的区别。 HTML代码： <div class="box"></div> <div class="box2"></div> 1 2 CSS代码： .box{ width: 200px; height: 200px; backgro
-
发表了文章 2023-01-11
详细解析DOM事件的event事件对象（二）
详细解析DOM事件的event事件对象（二） 上篇博客说到了DOM的键盘事件和鼠标事件的event对象，这次我们再来聊一聊event对象剩下的属性。 HTML代码： <div class="box">1</div> <div class="box">2</div> <div class="box">3</div> <div class="box">4</div> <div class="box">5</div> 1 2 3 4 5 CSS代码： *{ margin: 0;
-
发表了文章 2023-01-11
详细解析DOM事件的event事件对象（一）
JavaScript 86 篇文章 7 订阅 订阅专栏 详细解析DOM事件的event事件对象（一） 近期我们一直在学习DOM，马上到了尾期了，今天来说一下DOM事件的event事件对象。这里我们先解析一下键盘和鼠标事件的event对象属性。 HTML代码： <form> <input type="text" id="text"> <!-- <input type="submit"> --> <button>登录</button> </form> 1 2 3 4 5 1.键盘事件
-
发表了文章 2023-01-11
JavaScript实现省市区三级联动
JavaScript实现省市区三级联动 之前的文章中我们说到过如何利用JavaScript实现二级联动，这次我们来说说如何利用JavaScript实现三级联动。效果如图： 在这里插入图片描述 HTML代码： 请选择省份：<select name="" id="province"> <option value="">请选择省份......</option> </select> 请选择城市：<select name="" id="city"> <option value="">请选择城市......</option> </sel
-
发表了文章 2023-01-11
最简单的利用原生js模拟电视机屏保效果
最简单的利用原生js模拟电视机屏保效果 小的时候记得家里刚用彩色电视机时，看电视还要用天线，当天线信号不好时，电视屏幕就会进入到屏保状态，有一串文字在屏幕内“撞来撞去”。下面我们来讲一下如何实现下图这个效果： 在这里插入图片描述 HTML代码： 调速：<input type="number" name="" id="num"> <div id="box"></div> 1 2 CSS代码： * { margin: 0; padding: 0; } #box { width:
-
发表了文章 2023-01-11
利用JavaScript实现键盘控制小方块移动
利用JavaScript实现键盘控制小方块移动 HTML代码： <div class="box"></div> 1 CSS代码： *{ margin: 0; padding: 0; } .box{ width: 200px; height: 200px; background: red; } 1 2 3 4 5 6 7 8
-
发表了文章 2023-01-11
史上最详细的DOM事件之框架事件
史上最详细的DOM事件之框架事件 上篇博客讲了DOM的拖动事件，这篇博客我们来讲一讲DOM的媒体事件。 HTML代码： <img src="../../CSS/0421/car.gif" alt=""> 1 JS代码： var oImg=document.getElementsByTagName("img")[0]; // 属性 描述 DOM // onload 一张页面或一幅图像完成加载。 // window.onloda=function(){ // } oImg.onload=function(ev)
-
发表了文章 2023-01-11
史上最详细的DOM事件之媒体事件
史上最详细的DOM事件之媒体事件 上篇博客讲了DOM的拖动事件，这篇博客我们来讲一讲DOM的媒体事件。 HTML代码： <audio src="念旧-阿悠悠.mp3" controls></audio> 1 JS代码： var oAudio=document.getElementsByTagName("audio")[0]; // 事件 描述 DOM // onabort 事件在视频/音频（audio/video）终止加载时触发。 // oncanplay 事件在用户可以开始播放视频/音频（audio/video）时触发。
-
发表了文章 2023-01-11
史上最详细的DOM事件之拖动事件
史上最详细的DOM事件之拖动事件 上篇博客讲了DOM的剪贴板事件，这篇博客我们来讲一讲DOM的拖动(DragEvent)事件。 HTMl代码： <img src="../../CSS/0421/car.jpg" draggable="false"> 1 JS代码： var oImg=document.getElementsByTagName("img")[0]; // DragEvent 拖动事件 // ondrag 该事件在元素正在拖动时触发 oImg.ondrag=function(ev){ console
-
发表了文章 2023-01-11
史上最详细的DOM事件之剪贴板事件
史上最详细的DOM事件之剪贴板事件 上篇博客讲了DOM的表单事件，这篇博客我们来讲一讲DOM的剪贴板（ClipboardEvent）事件。 HTML代码： <div id="box">hello world</div> <p>这是一个段落标签</p> <input type="text" id="text"> 1 2 3 1.oncopy(赋值)事件 var oBox = document.getElementById("box"); var oText=document.getElementById("text");
-
发表了文章 2023-01-11
史上最详细的DOM事件之表单事件
史上最详细的DOM事件之表单事件 上篇博客讲了DOM的键盘事件，这篇博客我们来讲一讲DOM的表单事件。 HTML代码： <form action=""> <input type="text" autofocus> <br> <input type="text"><br> <input type="search"><br> <input type="reset"><br> <input type="submit"><br> <textarea name="" id="area" cols
-
发表了文章 2023-01-11
史上最详细的DOM事件之键盘事件
HTML代码： <input type="text" name="" id="text"> <input type="text" name="" id="text2"> 1 2 1.onkeydown事件 var oText=document.getElementById("text"); var oText2=document.getElementById("text2"); // onkeydown 某个键盘按键被按下。 针对所有键 oText.onkeydown=function(event){ co
-
发表了文章
2023-01-16
浅谈Ajax请求中的GET,POST,PUT,DELETE,PATCH,OPTIONS
-
发表了文章
2023-01-16
史上最全HTML实体字符整理
-
发表了文章
2023-01-16
HTML5的学习之新增元素
-
发表了文章
2023-01-16
HTML5的学习之表单元素
-
发表了文章
2023-01-16
HTML5的学习之媒体元素
-
发表了文章
2023-01-16
HTML5的学习之canvas画布(五)
-
发表了文章
2023-01-16
HTML5的学习之canvas画布(四)
-
发表了文章
2023-01-16
HTML5的学习之canvas画布(三)
-
发表了文章
2023-01-16
HTML5的学习之canvas画布（二）
-
发表了文章
2023-01-16
HTML5的学习之canvas画布(一)
-
发表了文章
2023-01-16
教你如何用Canvas绘制整身的哆啦A梦
-
发表了文章
2023-01-16
教你如何利用canvas画布绘制哆啦A梦
-
发表了文章
2023-01-11
详细解析JavaScript中的全局属性和方法
-
发表了文章
2023-01-11
详细解析Ajax的使用之向服务器发送GET请求
-
发表了文章
2023-01-11
详细解析Ajax的使用之向服务器发送GET请求
-
发表了文章
2023-01-11
浏览器同步发送请求之form表单提交数据
-
发表了文章
2023-01-11
详细解析JavaScript的Ajax之同步和异步的区别
-
发表了文章
2023-01-11
详细解析cookie，sessionStroage和localStroage的区别
-
发表了文章
2023-01-11
简单解析JavaScript中的cookie对象
-
发表了文章
2023-01-11
详解BOM的存储对象
