原生JS实现-星级评分系统的简单实例

前端之家收集整理的这篇文章主要介绍了原生JS实现-星级评分系统的简单实例前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

今天我又写了个很酷的实例:星级评分系统(可自定义星星个数、显示信息) sufuStar.star(); 使用默认值5个星星,默认信息

var msg = [........]; sufuStar.star(10,msg);

自定义星星个数为10、显示信息msg格式参考默认值,条数必须和星星个数一致;

自己实现一些实例,有个好处,能增加应用各知识点的熟练度,还能检验出自己的薄弱项!一经发现,立即翻API文档恶补!

不知道是不是我太笨,这个实例居然写了整整一天!

不废话了,先说下这个实例涉及的知识点:

1.用CSS的border来画个三角形,并用before来把它加到其它元素上;

2.学习如何用CSS来定位元素;

3.学习事件的代理;

4.如何优化性能

5.String对象的match方法的应用,正则表达式的应用;

6.注册事件与事件处理,需要兼容IE的写法;

7.学习如何利用‘||'给变量设置默认值;

8.简化代码:将可能要重复写的代码拿出来,单独写成一个函数

下面是带注释的完整代码,碰到不懂得就查文档吧,以我目前的水平只能写成这样了,若有好的建议,欢迎前辈指出!

<Meta charset="UTF-8">
点击星星打分:

以上这篇原生JS实现-星级评分系统的简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。

原文链接:https://www.f2er.com/js/46419.html

猜你在找的JavaScript相关文章