摘要: Js 原型链 原型链查找机制 每当代码读取某个对象的某个属性时,都会执行一次搜索,目标时具有给定名字的属性: ①搜索首先从对象实例本身开始 ②如果在实例中找到了具有给定名字的属性,则返回该属性的值 ③如果没有找到,则继续搜索指针指向的原型对象,在原型对象中查找具有给定名字的属性 ④如果在原型对象中找 阅读全文
posted @ 2021-03-09 21:13 小白可别不举铁 阅读(150) 评论(0) 推荐(0) 编辑
摘要: JS 创建对象的几种方式 new Object()构造函数 ​ var student1 = new Object(); ​ student.name = "zs"; ​ student.id = 123; ​ student.message = function(){ ​ console.log( 阅读全文
posted @ 2021-03-09 19:47 小白可别不举铁 阅读(136) 评论(0) 推荐(0) 编辑
摘要: JS 面向对象 面向对象 ①对象是单个事物的抽象 ②对象是一个容器。封装了属性和方法 属性:对象的状态 方法:对象的行为 实际开发中,对象是一个抽象的概念,可以理解为数据集或功能集。 ECMAScript-262 把对象定义为:无序属性的集合,其属性可以包含基本值、对象或函数 面向对象编程 (OOP 阅读全文
posted @ 2021-03-09 17:53 小白可别不举铁 阅读(231) 评论(0) 推荐(0) 编辑
摘要: location 对象 location 对象是window对象下的一个属性,使用时可以省略window对象 location可以获取或者设置浏览地址栏的URL <body> <input type="button" value="点击显示" id="btn"> <p id="txt"></p> < 阅读全文
posted @ 2021-03-06 15:46 小白可别不举铁 阅读(175) 评论(0) 推荐(0) 编辑
摘要: 简单无缝滚动轮播图存在很多漏洞,就是后期增加图片时会很不方便,需要改动的地方也很多,耦合性也很强,只适用于一部分程序,所以我们可以通过改动图片结构和计算折算点的方式,升级代码。 原简单的滚动轮播代码 <html> <head> <meta charset="UTF-8"> <meta http-eq 阅读全文
posted @ 2021-03-05 23:30 小白可别不举铁 阅读(181) 评论(0) 推荐(0) 编辑
摘要: 效果展示如下: 当前面滚动出去的left比-1470还小时,就要让图片位置重新归0 <html> <head> <style> *{ margin: 0; padding: 0; } .scroll{ position: relative; width: 830px;/*展示宽度 展示4个图+3个边 阅读全文
posted @ 2021-03-05 22:28 小白可别不举铁 阅读(320) 评论(0) 推荐(0) 编辑
摘要: 简单运动 简单运动:是一种视觉暂留效果,只要元素变化过程时间够短,给人眼造成的效果就是一个运动的效果,人眼的视觉残留的时间0.1~0.4 s 可以通过定时器,实现每隔一个极短时间(50~100毫秒左右),执行函数,函数内部让运动的属性值发生变化 定时器常见问题1 将定时器的开始和停止过程写在不同的事 阅读全文
posted @ 2021-03-04 23:05 小白可别不举铁 阅读(171) 评论(0) 推荐(0) 编辑
摘要: 原生js 使用for循环和排他思想实现轮播图 轮播、切换功能。 这里排他思想指的是排除其他,保留自己,方法就是最开始将所有的项包括选中项都设置为默认样式,再遍历数组给相应的选中项设置自己的样式 具体代码和注释如下: <!DOCTYPE html> <html lang="en"> <head> <m 阅读全文
posted @ 2021-03-03 23:01 小白可别不举铁 阅读(128) 评论(0) 推荐(0) 编辑
摘要: 原生Js实现画廊功能,点击图片,在下方出现相应放大图片。给a标签绑定onclick点击事件。这里上方的小图和下方将要展示大图,都是同一张图片,只是上下两个img的style中设置了不同的width和heigth。(如果不想设置width、height,另一种方法就是将a标签里src的图片存成大图,i 阅读全文
posted @ 2021-03-03 22:51 小白可别不举铁 阅读(203) 评论(0) 推荐(0) 编辑
摘要: 通过事件对象属性e.clientX / e.clientY(鼠标距离浏览器窗口左上角的距离),实现图片随鼠标一起移动的功能~ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-C 阅读全文
posted @ 2021-03-03 22:43 小白可别不举铁 阅读(884) 评论(0) 推荐(0) 编辑