js快速打印一个五分制（五颗星）的评分情况

1.函数

下面这个函数实现了在html页面中快速打印一个五分制（五颗星）的评分情况：

1 function getRating(rating) {
2     if(rating > 5 || rating < 0) throw new Error('数字不在范围内');
3         return "★★★★★☆☆☆☆☆".substring(5 - rating, 10 - rating );
4 }

2.demo如下

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta charset="utf-8">
 6 <title>star</title>
 7 <style>
 8 body, div {
 9     padding: 0;
10     margin: 0;
11 }
12 </style>
13 </head>
14 
15 <body>
16     <div  id="x" onclick="getRating(3);">Click me</div>
17 <script>
18 function getRating(rating) {
19     if(rating > 5 || rating < 0) throw new Error('数字不在范围内');
20     var div=document.getElementById('x');
21     div.innerHTML="★★★★★☆☆☆☆☆".substring(5 - rating, 10 - rating );
22 }
23 </script>
24 </body>
25 </html>

4.效果图

     

5.说明

substring函数时js的原生函数，其用法如下：

substring() 方法用于提取字符串中介于两个指定下标之间的字符。

语法

stringObject.substring(start,stop)
参数描述
start 必需。一个非负的整数，规定要提取的子串的第一个字符在 stringObject 中的位置。
stop

可选。一个非负的整数，比要提取的子串的最后一个字符在 stringObject 中的位置多 1。

如果省略该参数，那么返回的子串会一直到字符串的结尾。

返回值

一个新的字符串，该字符串值包含 stringObject 的一个子字符串，其内容是从 start 处到 stop-1 处的所有字符，其长度为 stop 减 start。

说明

substring() 方法返回的子串包括 start 处的字符，但不包括 stop 处的字符。

如果参数 start 与 stop 相等，那么该方法返回的就是一个空串（即长度为 0 的字符串）。如果 start 比 stop 大，那么该方法在提取子串之前会先交换这两个参数。

posted on 2015-11-27 10:42  flyrui316  阅读(899)  评论(0)  编辑  收藏  举报

导航