Heim >Web-Frontend >js-Tutorial >So geben Sie die 99er-Multiplikationstabelle mit JavaScript aus
Der folgende Editor zeigt Ihnen ein einfaches Beispiel für die Implementierung der Multiplikationstabelle in JavaScript. Der Herausgeber findet es ziemlich gut, deshalb werde ich es jetzt mit Ihnen teilen und es allen als Referenz geben. Folgen wir dem Herausgeber und werfen wir einen Blick darauf.
Jeder, der Programmieren gelernt hat, hat „Hello World“ geschrieben.
Aber das 99er-Einmalbuch sollte meiner Meinung nach auch ein Muss für jeden Programmieranfänger werden . Programmierung
Dies ist die Implementierungsmethode von JavaScript, sehr gut für Anfänger geeignet! ! !
Im Folgenden sind die Codes und Kommentare aufgeführt.
<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>JavaScript九九乘法表</title> <style type="text/css"> table{ width:600px; //表格height属性可设置可不设置,建议不设置 border-collapse:separate; } table td{ border:#000000 1px solid; text-align: center; //使<td>标签中的内容居中显示,若是<th>标签,没有此行代码亦可自动居中 } </style> </head> <body> <script type="text/javascript"> //下面部分是核心代码 document.write("<table>"); //<table></table>添加一个表格样式来显示乘法表 for (var x = 1; x <= 9; x++) { document.write("<tr>"); //<tr></tr>标签 for (var y = 1; y <= x; y++) { document.write("<td>"+y+"x"+x+"="+y*x+"</td>");//亦可用<th>标签来起到居中加粗内容的作用 } document.write("</tr>"); } document.write("</table>"); </script> </body> </html>
Im Folgenden sind einige der darin enthaltenen Inhalte aufgeführt obiger Code
•f5d188ed2c074f8b944552db028f98a1 Tag definiert eine Tabelle!
a34de1251f0d9fe1e645927f19a896e8 - Tabellenzeilen definieren
b4d429308760b6c2d20d6300079ed38e - Tabellenkopf definieren
b6c5a531a458a2e790c1fd6421739d1c - Tabellenelemente definieren table )
border=""Attribut kann den Rand der Tabelle festlegen! Die Wörter in
b4d429308760b6c2d20d6300079ed38e sind standardmäßig fett und zentriert!
bgcolor=""Das heißt, ich bin mit dem Festlegen der Tabellenhintergrundfarbe vertraut!
•cellspacing="" und cellpadding="" werden verwendet, um den Abstand zwischen Tabellen und den Abstand zwischen Zellen festzulegen! Aber beide Tags wurden durch HTML5 entfernt und durch border-collapse:separate | ersetzt.
separate | 默认值。边框会被分开。不会忽略border-spacing 和 empty-cells 属性。 |
collapse | 如果可能,边框会合并为一个单一的边框。会忽略border-spacing 和 empty-cells 属性。 |
inherit | 规定应该从父元素继承border-collapse属性的值。 |
Das obige ist der detaillierte Inhalt vonSo geben Sie die 99er-Multiplikationstabelle mit JavaScript aus. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!