前端学习之JavaScript
关注
分享
扫一扫
文章平均质量分 90
前端菜菜阿海
从零开始的前端学习者
展开
-
JS中for循环中使用同一变量的方法及案例
JS中for循环中使用同一变量的方法方法案例方法方法一（使用较简单）：使用let定义变量，let用来声明它的作用域的变量。 for (let i = 0; i < 10; i++) { div[i].onmouseout = function () { div[i].style.backgroundColor = 'pink'; } }方法二：分离作用域，再调用 f原创 2021-07-14 22:22:11 · 1271 阅读 · 0 评论 -
JS实现轮播图点击切换、按钮切换功能
JS实现轮播图点击切换、按钮切换功能前言轮播图案例总结前言轮播图的案例非常经典，写法也非常多，我在写一个自己用的比较多的写法，帮助大家理解，在网页的设计中，可以直接拿去用（记得换图片路径哦！），仅供参考学习。轮播图案例代码如下（示例）：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title>原创 2021-07-13 17:33:09 · 16778 阅读 · 13 评论 -
JavaScript和CSS在HTML文档中不同位置的区别
JavaScript在HTML文档中不同位置的区别前言一、浏览器是如何渲染HTML的？总结前言JS在HTML中放在不同位置的地方会有什么问题呢？我将在这篇文章按照自己的理解为大家介绍一下JS的运行机制。一、浏览器是如何渲染HTML的？首先一个HTML文件是长这样的：我们一般在body里面编写HTML元素，在head里面编写CSS样式，但是CSS的样式有三种写法：1.行内式、2.嵌入式（我在文章里面用的比较多，主要是代码方便上传）、3.链接式（标准方法，建议大家多用这种）。CSS嵌入式放在HT原创 2021-07-12 17:06:23 · 521 阅读 · 0 评论 -
JS实现漂浮广告功能
JS实现漂浮广告功能前言一、漂浮广告案例前言漂浮广告非常简单也是老案例了，在网页的设计中可直接拿去用，原理都是我之前文章所讲到的，如果有什么不明白的可以看看我之前的文章，仅供参考学习。一、漂浮广告案例我在这个案例里面加了一些其他的操作，例如：移入时广告静止，移出时广告漂浮，点击一次跳转到另一个页面，点击俩次广告消失。代码如下（示例）： <style type="text/css"> #div1 { width: 300px;原创 2021-07-11 17:24:06 · 7367 阅读 · 2 评论 -
JS实现验证码倒计时验证案例
JS实现验证码倒计时验证案例前言验证案例1.代码2.代码功能解析1.验证码2.验证3.倒计时总结前言这是一个将验证和倒计时综合起来的案例，案例也不难理解，在页面的设计中，需要这样的代码时可直接套用，仅供参考学习。验证案例1.代码代码如下（示例）： <style> #a { position: absolute; left: 260px; border-radius: 15px;原创 2021-07-10 17:28:28 · 1513 阅读 · 0 评论 -
JS全选反选及节点操作实现收件箱案例
JS全选反选及节点操作实现收件箱案例前言一、全选反选之商品选择二、节点操作之留言板（添加、删除）三、综合案例1.收件箱2.文本上下移动添加及删除功能总结前言JavaScript中的节点操作是一处重要的知识点，在很多的地方都有它的身影，我按照自己之前的学习，整理了一些节点操作的案例，用于加强学习和理解，仅供参考学习。一、全选反选之商品选择代码如下（示例）： <style> * { padding: 0; margi原创 2021-07-09 16:56:47 · 338 阅读 · 0 评论 -
JS定时器原理及案例
JavaScript精选案例这个系列是在阿海前端学习中遇到的一些经典案例，具有很大的学习意义！JS定时器原理及案例JavaScript精选案例前言一、定时器二、定时器的使用1.定时器2.清除定时器三、案例1.倒计时2.使用和清除定时器3.发送短信总结前言JS中定时器并不算难点，但是我还是拿出来讲，过于经典的案例往往是最为基础的知识点，仅供参考学习。一、定时器setTimeout(code,millisec)：只执行 code 一次。setInterval(code,millisec)原创 2021-07-08 16:27:36 · 1476 阅读 · 0 评论 -
JS实现放大镜功能
JavaScript精选案例这个系列是在阿海前端学习中遇到的一些经典案例，具有很大的学习意义！JS实现放大镜功能JavaScript精选案例前言一、放大镜案例方法一方法二总结前言js制作放大镜是非常经典的案例，在很多地方也非常常见，例如商品的查看，我也整理了一些自己以前使用过的方法，仅供参考学习。一、放大镜案例方法一第一种方法较为常见，也更容易理解代码如下（示例）： <style> .box { position: rela原创 2021-07-06 17:07:07 · 1022 阅读 · 0 评论 -
JS中常用的事件操作
JavaScript精选案例这个系列是在阿海前端学习中遇到的一些经典案例，具有很大的学习意义！JS中常用的事件操作JavaScript精选案例前言一、点击事件（导航栏切换）二、移入移出事件（导航栏菜单下拉功能）三、失去焦点事件四、鼠标事件五、键盘事件总结前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例可供参考一、点击事件（导航栏切换）原创 2021-07-05 20:47:41 · 590 阅读 · 0 评论