查看本章节

查看作业目录

需求说明：

使用 JavaScript 中的 document 对象查找 HTML 元素，实现“登录”按钮的高亮特效 鼠标悬浮于“登录”按钮时，按钮高亮显示；

  • 鼠标离开时，按钮恢复原状。
  • “登录”按钮初始效果如图所示
  • 鼠标悬浮时，按钮高亮显示。“登录”按钮高亮显示效果如图所示

实现思路：

  1. 在 window 的 onload 事件中获取一组指定 name="btnLogin" 的“登录”按钮
  2. 用循环依次给每个 name=“btnLogin”的按钮设置 onmouseover 和 onmouseout 事件处理函数
  3. 在事件绑定的函数中，设置图像按钮的 src 属性，利用更换图像来达到高亮显示和恢复原状的特效

实现代码：

使用 JavaScript 中的 document 对象查找 HTML 元素，实现“登录”按钮的高亮特效 鼠标悬浮于“登录”按钮时，按钮高亮显示；的更多相关文章

  1. 使用 JavaScript 中的 document 对象的属性，根据下拉框中选择的属性，更改页面中的字体颜色和背景颜色

    查看本章节 查看作业目录 需求说明: 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色 实现思路: 在页面的 <body&g ...

  2. JavaScript中的global对象，window对象以及document对象的区别和联系

    JavaScript中的global对象,window对象以及document对象的区别和联系 一.概念区分:JavaScript中的global对象,window对象以及document对象 1.g ...

  3. JavaScript中的事件对象

    JavaScript中的事件对象 JavaScript中的事件对象是非常重要的,恐怕是我们在项目中使用的最多的了.在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含这所有与事件有 ...

  4. JavaScript：JavaScript中常见获取对象元素的方法

    介绍: javascript中常见的3种获取元素的方法,分别是通过元素ID.通过标签名字和通过类名字来获取 操作如下: 1.getElementById DOM提供了一个名为getElementByI ...

  5. Javascript学习1 - Javascript中的类型对象

    原文:Javascript学习1 - Javascript中的类型对象 1.1关于Numbers对象. 常用的方法:number.toString() 不用具体介绍,把数字转换为字符串,相应的还有一个 ...

  6. 简单使用JSON,JavaScript中创建 JSON 对象(一)

    JSON:JavaScript 对象表示法(JavaScript Object Notation). JSON 是存储和交换文本信息的语法.类似 XML. JSON 比 XML 更小.更快,更易解析. ...

  7. 详解javascript中的this对象

    详解javascript中的this对象 前言 Javascript是一门基于对象的动态语言,也就是说,所有东西都是对象,一个很典型的例子就是函数也被视为普通的对象.Javascript可以通过一定的 ...

  8. javascript中window,document,body的解释

    解释javascript中window,document,body的区别: window对象表示浏览器中打开的窗口,即是一个浏览器窗口只有一个window对象. document对象是载入浏览器的ht ...

  9. 【学习笔记】：JavaScript中的BOM对象

    JavaScript中的BOM对象 BOM(Browser Object Model):浏览器对象模型. BOM可用于对浏览器窗口进行访问,但BOM没有相关的标准,所以根据浏览器的不同,其中定义的对象 ...

随机推荐

  1. [转] Java中对数据进行加密的几种方法

    加密算法有很多种:这里只大约列举几例: 1:消息摘要:(数字指纹):既对一个任意长度的一个数据块进行计算,产生一个唯一指纹.MD5/SHA1发送给其他人你的信息和摘要,其他人用相同的加密方法得到摘要, ...

  2. 二叉树——Java实现

    1 package struct; 2 3 interface Tree{ 4 //插入元素 5 void insert(int value); 6 //中序遍历 7 void inOrder(); ...

  3. 【Linux】【Services】【Cache】使用Sentinel搭建高可用Redis

    1. 简介 1.1. 一些基础概念请参考 http://www.cnblogs.com/demonzk/p/7453494.html 1.2. 几种常用的集群方式. -- Redis Sentinel ...

  4. testng 执行多个suite

    我们知道testng的配置文件,一个.xml里面只能有一个suite,那么如果想要设置多个suite怎么弄呢?这个时候我们需要用到testng的标签<suite-files>. 下面说一下 ...

  5. SharedWorker实现多标签页联动计时器

    web workers对于每个前端开发者并不陌生,在mdn中的定义:Web Worker为Web内容在后台线程中运行脚本提供了一种简单的方法.线程可以执行任务而不干扰用户界面.此外,他们可以使用XML ...

  6. Redis的一致性哈希算法

    一.节点取余 根据redis的键或者ID,再根据节点数量进行取余. key:value如下 name:1 zhangsna:18:北京 对name:1 进行hash操作,得出来得值是242342345 ...

  7. 资源日历关联（Project）

    <Project2016 企业项目管理实践>张会斌 董方好 编著 其实,[日历]并不是[任务]的唯一,他还有另一个老相好:[资源]. 是啊,就像张同学给的例子那样,得为一个专门的外聘专家这 ...

  8. springboot学习(一)

    最近想学习springboot所以在网上找了很多文章参考怎么构建springboot项目以及集成mybatis 集成mybatis的部分参考了这两篇文章 https://blog.csdn.net/t ...

  9. .net core使用EF core连接mssqlserver数据库

    一,打开控制台二,输入以下代码1.Install-Package Microsoft.EntityFrameworkCore 2.Install-Package Microsoft.EntityFra ...

  10. 使用.NET 6开发TodoList应用(3)——引入第三方日志库

    需求 在我们项目开发的过程中,使用.NET 6自带的日志系统有时是不能满足实际需求的,比如有的时候我们需要将日志输出到第三方平台上,最典型的应用就是在各种云平台上,为了集中管理日志和查询日志,通常会选 ...