继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

【学习打卡】第10天 仿计算器案例(课程前置知识)

土星猪
关注TA
已关注
手记 76
粉丝 5
获赞 0

一 课程名称


课程名称:仿计算器案例


课程章节:课程前置知识


二 课程内容

    在body中完成一个html定义onclick和在js里定义onclick的对比


    1.在html定义onclick事件

    2.在js里定义onclick事件

    


配置

http://img.mukewang.com/62fa1408000180fb13560290.jpg

我们用两个button 来做实验

http://img3.mukewang.com/62fa151600012c7f14610682.jpg

http://img.mukewang.com/62fa171b0001e92c09510407.jpg

现在点击按钮是没有任何效果的,因为没用事件处理函数


所以我们去创建一个函数,第一个函数我们写进html

http://img1.mukewang.com/62fa17e8000145fd06910370.jpg

把onclick写到html里

http://img.mukewang.com/62fa18d60001c59a12170592.jpg

去页面单击test1 这样事件就触发了

http://img.mukewang.com/62fa192100018a4414660253.jpg


第二个onclick我们用另外一种方式,不写进html里实现

写入一个函数,用来获取按钮2的id(test2)


http://img3.mukewang.com/62fa1e9a0001c25309090495.jpg

http://img1.mukewang.com/62fa1ea90001b7cb06210302.jpg


把onclick事件写到js函数里

这里把onclick写进js函数,onclick在里面就等于是一个内置的函数,也可以称为匿名函数

这个函数只供onclick使用

http://img4.mukewang.com/62fa21e70001f3e014220637.jpg

这行代码就等于给按钮2添加了一个onclick,要做什么事件去取定于里面onclick函数要做什么事件。

添加完后,我们需要取读取这个事件,否则是不能触发的


所以要给body添加onload事件,我们可以理解为刷新或者是叫加载事件


http://img3.mukewang.com/62fa23d3000109b009080422.jpg

onload 执行ff2函数


去页面点击按钮2就生效了


http://img4.mukewang.com/62fa24cd000166a615940480.jpg


我们也可以在ff2函数里调用其他函数,像ff1也是可以执行的

http://img2.mukewang.com/62fa251c000122cd12110543.jpg



本节总结

    理解这两种不同的写法,为下一节打下基础  O(∩_∩)O


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP