随笔分类 - JavaScript
对于JavaScript的实践
摘要：记录几个坑 之前的轮播： 完整代码： "GitHub" 效果预览： "GitHub" 最近完成的轮播： 完整代码： "GitHub" 效果预览： "GitHub" 在完成轮播中解决两个问题： 1.setInterval()会和按钮绑定的事件发生冲突。 表现为：setInterval()设置了每3S轮
阅读全文
摘要：无缝轮播 完整代码： "GitHub" 效果预览： "GitHub" 之前的轮播思路： 1：图片主要使用flex定位加上transform:translateX()，配合JS代码，完成图片切换。缺点：不能进行无缝轮播，图片进行到最后一张要原路返回切换到第一张。 2：图片主要使用position:ab
阅读全文
摘要：继续学习DOM事件模型 继续深入一下对于DOM事件模型的学习，理解事件捕获与冒泡。 假设我们有一个需求，点击之后浮层出现；点击别处浮层消失。 给按钮添加事件： 按钮点击之后，浮层出现。 如果要设置成点击别处之后浮层消失，该怎么操作？ 思路1：监听body，当body被点击后，浮层消失 点击图中的空白
阅读全文
摘要：代码链接： "我的GitHub" 项目预览： "预览" 目的：通过CSS + jQuery的方式实现自动轮播。 1.用CSS3来实现轮播 思路：通过给每一个按钮添加点击事件，点击之后改变图片的位置，从而实现轮播。 HTML结构 实现要点： HTML中主要存在两个div，一个div加载图片，利用fle
阅读全文
摘要：最近学习到了jQuery的内容，从DOM到jQuery之间，到底发生了什么变化，怎么从DOM转变到jQuery，他们之间存在什么联系和区别，这篇博文梳理一下初入门学习jQuery的一些思路和分析过程。 这是 "jQuery" 官方网站和 "中文文档" 。 假设现在我们有这样的一个HTML结构： 1.
阅读全文
摘要：JavaScript中的数据类型 最近在看阮一峰老师的 "博客" ，其中有较全面地介绍了JavaScript的数据类型。 关于数据类型中的一些基础知识阮老师已经讲得很清楚，遇到不清楚的地方我们可以去MDN查看文档，现在写这篇博客的目的主要是梳理一下知识以及记录一些容易出错的点，希望能帮到更多的朋友。
阅读全文
摘要：项目链接： "GitHub" 项目预览： "Github Pages" 项目描述：通过 "MDN" 提供的教程和API，创建一个拥有基本功能（包括绘画，橡皮擦，保存等）的canvas画板。 承接 "上一小结" 目前我们的canvas画板是可以在浏览器上使用的，但是如果我们的项目如果想要在手机端或者其
阅读全文
摘要：创建一个canvas画板 项目链接： "GitHub" 项目预览： "Github Pages" 项目描述：通过 "MDN" 提供的教程和API，创建一个拥有基本功能（包括绘画，橡皮擦，保存等）的canvas画板。 在教程的学习过程中，掌握canvas的基本用法，以及需要注意的一些地方。 开始创建一
阅读全文
摘要：键盘导航知识点总结 项目预览链接： "GitHub Pages" 项目链接： "GitHub" 项目描述：用JavaScript创建一个可以自己更改链接、样式为键盘的导航网站。 使用JavaScript给HTML添加多个div 我们在构建HTML的时候，出于结构需要可能会需要添加多个具有相同属性、c
阅读全文
摘要：ls命令用来显示目标列表，输出信息可以进行彩色加亮显示，以分区不同类型的文件。 如下图，可以看到，在主目录~下输入了 命令后，显示出了该目录下的所有文件及文件夹。 命令用于连接文件并打印到标准输出设备上。 比下图，在test目录下创建一个包含了字符串“hello world”的1.txt,又创建了不
阅读全文
摘要：** * AJAX函数封装 * @param {string} url 请求地址（必须） * @param {object} options 发送请求的选项参数 * @config {string} [options.type] 请求发送的类型。默认为GET。 * @config {Object} [options.data] 需要发送的数据。 * @config...
阅读全文
摘要：// BOM // 判断是否为IE浏览器，返回-1或者版本号 function isIE() { var uUserAgent = navigator.userAgent; //保存浏览器的userAgent var ieAgent = uUserAgent.match(/msie (\d+.\d+)/i); if (ieAgent) { return ...
阅读全文
摘要：// 事件 // 这里的addEvent()函数到了最后做大作业的时候会出现bug(暂时不能解决) // 给一个element绑定一个针对event事件的响应，响应函数为listener // function addEvent(element, event, listener) { // element = element.trim(); // switch(element.c...
阅读全文
摘要：其中实现简易query参考了这篇博文，感谢这位博主。
阅读全文
摘要：// 判断是否为邮箱地址 // ^ 表示匹配开头 // \w+ \w表示匹配一个英文字母或数字，+表示匹配前面的元素一次或者多次 // @ 表示匹配@符号 // [a-z0-9]+ [a-z0-9]表示匹配字母a-z或0-9，+表示匹配前面的元素一次或者多次 // \. 表示匹配一个. // [a-z]+ 表示匹配字母a-z之中任意一个，+表示匹配前面的元素一次或者多次 // {1,3}...
阅读全文
摘要：// 数组去重方法Set function uniqArray(arr) { // 先把数组经过Set处理，生成一个Set对象(Set 对象允许你存储任何类型的唯一值，无论是原始值或者是对象引用。)，再用Array.from再转化成一个数组 // Array.from() 方法从一个类似数组或可迭代对象中创建一个新的数组实例。 return Array.from(new ...
阅读全文
摘要：了解JS中简易克隆与深度克隆的概念和区别： 浅度克隆：原始类型为值传递，对象类型仍为引用传递。 深度克隆：所有元素或属性均完全复制，与原对象完全脱离，也就是说所有对于新对象的修改都不会反映到原对象中。 // 浅度克隆：原始类型为值传递，对象类型仍为引用传递。/对于对象的浅克隆，修改新对象的时候会把原
阅读全文
摘要：// 遍历字符串并把他添加到一个新的数组里 var stringTest = "Username" var arrTest = new Array() for (i = 0; i < stringTest.length; i++) { arrTest[i] = stringTest[i] } console.log(arrTest) // 遍历对象并Log出来 var obj = {a...
阅读全文
摘要：实践判断各种数据类型的方法: 参考链接：判断js中数据类型的几种方法
阅读全文
浙公网安备 33010602011771号