章节
问答
课签
笔记
评论
占位
占位

编程练习

小伙伴们,请为导航添加鼠标移开效果

效果图:

温馨提示:完成任务后,请验证是否与实践描述效果一致,如一致,恭喜您,你已经掌握此技能。

任务

在编辑器的第206行处,使用JS代码,循环设置li标签的鼠标的移入和移开效果

提示:指定li标签onmouseover和onmouseout函数,设置移入时样式为lihover,设置移开时样式为空即可。

?不会了怎么办

参考代码:

 <script type="text/javascript">

        window.onload = function () {

            var Lis = document.getElementsByTagName("li");

            for (i = 0; i < Lis.length; i++) {

                Lis[i].i = i;

               //设置鼠标移入时的样式。

                Lis[i].onmouseover = function () {

                    this.className = "lihover";

                }

                  //设置鼠标移开时的样式为空。

                Lis[i].onmouseout = function () {

                    this.className = "";

                }

            }

        }

    </script>

||
1
<!DOCTYPE html
    PUBLIC "
    -//W3C
    //DTD
    XHTML 1.0
    Transition
    al//EN"
    "http
    ://www.w3
    .org/TR
    /xhtml1
    /DTD
    /xhtml1
    -transitio
    nal.dtd">
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
提交
重置代码
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

收藏课程后,能更快找到我哦~

使用 Ctrl+D 可将课程添加到书签

邀请您关注公众号
关注后,及时获悉本课程动态

举报

0/150
提交
取消
全部 精华 我要发布

最新回答 / 慕无忌0377367
你方法写错了 是getElementsByTagName  你多写了一个e

最新回答 / 清风流光
 目前来看 不加也可以啊 没影响的 每次循环事件函数都会单独保存 

最新回答 / 绝版女鬼
检查错误。标点符号错误。拼写错误。

已采纳回答 / 碎裂的辰星
topmenu中li原来的height=30px,lihover中的height为60px

已采纳回答 / 我是刘高兴
<...code...>注意注释对应的内容,这样便可以了

已采纳回答 / 用户1136527
如果没有“Lis[i].i = i;”这句话,每次遍历完的i结果就是最后一次遍历的那个结果,所以再求h0的时候h0是固定值了,每次悬浮层都在最底下。要想获取每次遍历的i值,就要加上这个Lis[i].i = i; var h0=(this.i-1)*30+42;

已采纳回答 / Collus
从字面解释就是:把变量i的值赋值给Lis[i]元素的i属性。这条语句主要用于获取每个<li>元素上边沿到顶部的距离。"Lis[i].i=i;"中有三个i,从左到右,第一个和第三个是相同的意思,表示存放<li>元素的数组Lis的下标。中间的i是动态添加给数组对象的属性(数组也是对象,所以可以动态添加属性)。PS:题注代码没贴全,这条语句是给下面代码中注释部分用的。<...code...>

已采纳回答 / 任性不是罪
建议你再去网上查找一些关于this的用法哦,this相当于一个指针,指向当前的已经获取的对象。但是你这里的aLi[i]却没有这个属性的哦

已采纳回答 / qq_浮云丶暖_03699680
if改成for,“Lis[i].i = i;”这句是什么作用,也去掉

最新回答 / 不肖生
o,知道了,老师把后面要讲的内容放到这里了。
全部 我要发布
最热 最新
只看我的

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

账号登录 验证码登录

遇到问题
忘记密码

代码语言