![](https://img-blog.csdnimg.cn/direct/15b4d939391f46d19819a9d5b20d077f.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
JavaScript基础
文章平均质量分 86
复习JavaScript基础
colorsZeroz
这个作者很懒,什么都没留下…
展开
-
JS08-DOM节点完整版
DOM节点操作的各种方法,包括查找、添加、删除和复制节点的技术细节,并结合实例介绍了JavaScript在动态操作网页元素上的应用,如创建微博发布与展示页面,以及实现购物车界面的商品管理功能。此外,还提及了DOM操作中与时间相关的知识,如获取当前时间、格式化输出及计算时间差以实现倒计时效果。尽管文中没有直接展示事件对象的使用,但提到了定时器setInterval在处理定时事件时如何获取并依据当前时间更新页面元素。整个讲解展示了JavaScript DOM API在实际Web开发中的核心作用,涵盖了从节点关系原创 2024-03-22 21:02:12 · 885 阅读 · 0 评论 -
JS07-DOM-class案例重置版
倒计时、焦点图、随机抽人、小米搜索框、。加减操作、环境变量this、排他思想、案例tab栏切换。原创 2024-03-22 20:58:37 · 555 阅读 · 0 评论 -
JS13-事件的绑定和事件对象Event
绑定事件的两种方式/D0M事件的级别、DOMO的写法:onclick、DOM2的写法:addEventListener(高版本浏览器)、DOM2的写法:attachEvent(IE8及以下版本浏览器) 兼容性写法事件对象、获取event对象(兼容性问题)、event属性、Event举例 举例1:使div跟随标移动、举例2:获取關标距离所在盒子的距离、举例3:商品放大镜原创 2024-03-20 20:49:19 · 1128 阅读 · 0 评论 -
JS12-client(可视区)相关属性
client家族的组成 clientWidth clientHeight clientX和clientY clientTop和clientLeft 三大家族offset/scroll/client的区别 区别1:宽高 区别2:上左 函数封装:获取浏览器的宽高(可视区域) 获取显示器的分辨率原创 2024-03-20 20:47:01 · 1220 阅读 · 0 评论 -
JS11-scroll相关属性和缓动动画
scroll 相关属性、window.onscroll() 方法原创 2024-03-19 15:24:14 · 1043 阅读 · 0 评论 -
JS10-offset相关属性和匀速动画(含轮播图的实现)
1、三大家族和一个事件对象: 三大家族:offset/scroll/client。也叫三大系列。 事件对象/event(事件被触动时,鼠标和键盘的状态)(通过属性控制)。 2、动画(闪现/匀速/缓动) 3、冒泡/兼容/封装原创 2024-03-19 14:22:06 · 596 阅读 · 0 评论 -
JS09-事件对象
事件对象属性用于定位鼠标点击位置;鼠标跟随效果利用mousemove事件实时更新元素位置;回车键触发发布微博逻辑则结合keyup事件判断用户输入状态;阻止冒泡技术确保点击子元素时仅执行子元素的事件处理器;阻止默认行为可以取消链接等元素的默认动作;事件委托技术在父级元素上监听,统一处理多个子元素的事件;学生信息表单案例演示了动态增删记录并通过事件驱动界面更新;手风琴效果借助mouseenter和mouseleave事件,联动CSS过渡实现元素宽度的伸缩变化。这些示例共同说明了JavaScript事件模型及其在原创 2024-03-17 22:34:34 · 820 阅读 · 0 评论 -
JS08-DOM节点
DOM节点操作的各种方法,包括查找、添加、删除和复制节点的技术细节,并结合实例介绍了JavaScript在动态操作网页元素上的应用,如创建微博发布与展示页面,以及实现购物车界面的商品管理功能。此外,还提及了DOM操作中与时间相关的知识,如获取当前时间、格式化输出及计算时间差以实现倒计时效果。尽管文中没有直接展示事件对象的使用,但提到了定时器setInterval在处理定时事件时如何获取并依据当前时间更新页面元素。整个讲解展示了JavaScript DOM API在实际Web开发中的核心作用,涵盖了从节点关系原创 2024-03-17 22:20:10 · 1017 阅读 · 0 评论 -
JS03-函数
伪数组比数组少了一些 pop() push()等方法。arguments 函数内有效 表现形式 伪数组。立即执行函数 立即执行,无需调用。1 第一个小括号 形参。2 第二个小括号 实参。原创 2024-03-15 17:20:10 · 408 阅读 · 1 评论 -
JS04-对象
在实际案例中,通过JavaScript动态生成学生信息表格,展示了数组遍历并将数据渲染到HTML页面的方法。另外,多次应用了获取随机数函数实现随机选取数组元素的案例,包括随机输出数组中的一个元素、随机点名(并从数组中移除已选元素)以及猜数字游戏。原创 2024-03-15 17:20:43 · 940 阅读 · 1 评论 -
JS05-DOM对象
querySelector、getElementById、getElementsByTagName和getElementsByClassName等DOM方法来获取元素。接着,利用innerText和innerHTML更改元素内容,前者纯文本,后者可包含HTML结构。案例部分包括两个小应用:一是随机点名系统,利用数学随机数选取数组内的名字并显示在页面指定位置;二是随机背景切换,通过随机数选定背景图片编号,动态设置body元素的背景图片URL,实现页面背景的随机变化原创 2024-03-15 17:21:26 · 825 阅读 · 1 评论 -
JS07-DOM-class案例
倒计时、焦点图、随机抽人、小米搜索框、。加减操作、环境变量this、排他思想、案例tab栏切换。原创 2024-03-16 21:05:48 · 1498 阅读 · 0 评论 -
JS06-class对象
使用className属性修改元素样式、利用classList API操作CSS类、修改表单元素属性、使用间歇函数(setInterval)设置定时任务原创 2024-03-16 20:07:26 · 450 阅读 · 1 评论 -
JS02-运算符
简易ATM程序中运用了条件判断、循环与赋值运算符模拟银行账户存取款及查询余额功能。九九乘法表案例利用嵌套循环结构结合算术运算符展示乘法口诀表。数组求最大值和最小值的案例通过遍历数组并对当前值与已知最大值/最小值比较更新,从而找到数组中的极值。冒泡排序算法通过双重循环交换相邻元素来实现数组升序排列。柱形图案例中,利用用户输入的四个数值动态创建柱状图,其中运用了算术运算符计算元素高度,并通过HTML DOM操作动态渲染图形,体现了JavaScript与HTML样式、DOM交互的能力。原创 2024-03-15 17:19:10 · 358 阅读 · 1 评论 -
JS01-JavaScript基础
JavaScript基础,包括在HTML中引入JS的内联与外部文件两种方式,演示了数组声明与访问,详述了数字、字符串、布尔、undefined、null五种数据类型,并展示了如何通过typeof检查变量类型。内容进一步探讨了JavaScript中的隐式类型转换,如“+”连接字符串时的字符串转换及“*”、“/”运算符引发的数字转换。同时列举了parseInt、parseFloat、Number、toString等显式转换方法,并通过实例说明如何在处理用户输入时利用隐式转换进行数值计算。原创 2024-03-15 17:18:35 · 381 阅读 · 1 评论