View code
<! Doctype HTML public "-// W3C // dtd html 4.0 transitional // en">
<HTML>
<Head>
<Title> special website scoring effect </title>
<Style type = "text/CSS">
*
{
Font-size: 50px;
}
</Style>
<Script language = "JavaScript" type = "text/JavaScript">
Function indexof (ARR, element) {// write the indexof method in Js;
For (VAR I = 0; I <arr. length; I ++ ){
If (ARR [I] = element ){
Return I;
}
}
Return-1;
}
Function commentlevel (){
VaR commentlevel = Document. getelementbyid ("commentlevel ");
VaR TDS = Document. getelementsbytagname ("TD"); // obtain the TD in the commentlevel table. The TD in other tables is not processed;
For (VAR I = 0; I <TDs. length; I ++ ){
VaR TD = TDS [I]; // obtain each TD;
TD. onmouseover = tdonclick;
TD. style. cursor = "Pointer ";
}
}
Function tdonclick (){
VaR commentlevel = Document. getelementbyid ("commentlevel ");
VaR TDS = Document. getelementsbytagname ("TD"); // obtain the TD in the commentlevel table. The TD in other tables is not processed;
VaR Index = indexof (TDS, this); // obtain the current click position;
For (VAR I = 0; I <= index; I ++) {// The previous values are red;
TDS [I]. innertext ="★";
}
For (VAR I = index + 1; I <TDs. length; I ++) {// after clicking it, It is white;
TDS [I]. innertext = "☆ ";
}
}
</SCRIPT>
</Head>
<Body onload = "commentlevel ()">
<Table id = "commentlevel">
<Tr>
<TD>
☆
</TD>
<TD>
☆
</TD>
<TD>
☆
</TD>
<TD>
☆
</TD>
<TD>
☆
</TD>
</Tr>
</Table>
</Body>
</Html>