昨天看到一句很有深刻道理的话——“种植一棵树最好的时候是十年前和现在”,那么现在就开始学习啊,一切都来得及。。。

零零星星学习了简单的静态页面,只能说能够勉强应付本职工作,最近要带几个学生学习前端,恍然才意识到自己知识的匮乏,得学习了,虽然也很迷茫,不知道从何学起,能想到的就是每天认真写工作笔记,应该是可以提高的吧。。。

    下面这两张图是昨天学生截图问我的问题,想实现的效果就是点击id为cn_的标签,显示对应的nt_内容部分,想问为什么没有效果,我也没有找到问题所在,好尴尬呀。。。。

这里写图片描述
这里写图片描述
以前写的是都是静态页面,有时候连这种简单的交互都省略了,全部交给我们伟大的后台小哥哥,所以慢慢的脑子已经要锈掉了,都要没有代码逻辑能力了,忧伤。。。忧伤的是图中学生用函数的封装来实现的交互功能,我自己是不知道的,丢脸吗。。。

    然后我问了我老大,他没有直接告诉我问题所在,只是教我如何在页面打断点调试代码,我似懂非懂,找了一个页面打断点,没搞明白,但是问题要解决的呀,又不好意思再去学生那里看,知道还是找不出问题的,自己试着把图中的代码写出来,是可以的呀,那为什么学生那里的不可以呢。。。





    发现问题所在了,学生引用的是外部链接mh.js文件,而且是在head标签里引用的,必须要在js文件中的头部没有加 window.onload = function(){} 来预先加载页面的元素再执行函数,否则js文件中索要的元素并没取值到,自然就没有实现想要的功能。另外,如果引用的js文件是在页面结尾引用的,自然就不用加window.onload了。


    好啦,今天就学到了两点知识:

    1、要有函数思维

            要有封装函数的思维来实现页面的交互功能,提高代码技术含量,能只停留在静态页面,html标签加css样式就交差完成任务;

    2、写JS文件时

            1)在页面头部内嵌式和在页面头部应用外链式js文件时,要先用window.onload = function(){        }来加载页面元素再触发函数;

            2 )如果是在页面底部内嵌式和在页面头部应用外链式js文件时则可以不用。

    3、另外,  jq的头部的预加载是: $(functino(){       })   。



        期待进步!!!

猜你喜欢

转载自blog.csdn.net/weixin_42924786/article/details/81538122