🎃个人专栏:
🐬 算法设计与分析:算法设计与分析_IT闫的博客-CSDN博客
🐳Java基础:Java基础_IT闫的博客-CSDN博客
🐋c语言:c语言_IT闫的博客-CSDN博客
🐟MySQL:数据结构_IT闫的博客-CSDN博客
🐠数据结构:数据结构_IT闫的博客-CSDN博客
💎C++:C++_IT闫的博客-CSDN博客
🥽C51单片机:C51单片机(STC89C516)_IT闫的博客-CSDN博客
💻基于HTML5的网页设计及应用:基于HTML5的网页设计及应用_IT闫的博客-CSDN博客
🥏python:python_IT闫的博客-CSDN博客
🐠离散数学:离散数学_IT闫的博客-CSDN博客
🥽Linux:Linux_Y小夜的博客-CSDN博客
🚝Rust:Rust_Y小夜的博客-CSDN博客
欢迎收看,希望对大家有用!
目录
🎯功能简介
这段代码实现了一个简单的HTML页面,其中包含一个表格用于展示学生信息,并使用JavaScript来计算指定数字集合中的最大值。
具体功能如下:
1. 页面标题:页面标题设置为“求任意个数的最小值”。
2. 表格内容:表格包含了学生的学院、姓名和学号等信息,并有两行用于展示计算结果的最大值。学号后4位的最大数字会在第一个单元格中显示,12位学号中的最大数字则会在第二个单元格中显示。
3. JavaScript函数:在`<script>`标签中定义了一个名为`getMax`的函数。该函数接收任意数量的参数,并返回这些参数中的最大值。
4. 事件处理:通过JavaScript,页面将会在用户点击特定单元格时,调用`getMax`函数并将计算结果更新到相应的单元格中。
总的来说,这段代码实现了一个简单的HTML页面,展示了学生信息并提供了计算最大值的功能。
🎯代码解析
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>求任意个数的最小值</title> <style> table { width: 600px; margin: auto; border: 1px solid black; border-collapse: collapse; } tr, td { height: 50px; color: blue; text-align: center; border: 1px solid black; } </style> </head>
在这部分中,我们设置了HTML文档的基本信息,包括文档类型和页面语言。在
<head>
标签内部,我们设置了字符集、视口宽度等信息,并定义了一些表格样式。<body> <h1 align='center'>利用arguments求任意个数的最大值</h1> <table> <tr> <td>学院:</td> <td>软件学院</td> </tr> <!-- 其余表格行 --> </table> <script> // JavaScript 代码 </script> </body>
在页面的主体部分,我们首先使用
<h1>
标签显示了一个标题,并将其居中显示。然后创建了一个表格,包含了一些学生信息以及用于显示最大值的两个单元格。最后,我们在<script>
标签内部编写了JavaScript代码用于计算最大值并更新页面上的单元格内容。<script> function getMax(){ var max=-1; for(var i=0;i<arguments.length;i++){ if(arguments[i]>max){ max=arguments[i]; } } return max; } var maxInFour1 =document.getElementById("max1"); var maxInFour2 =document.getElementById("max2"); maxInFour1.onclick=function(){ maxInFour1.innerHTML=getMax(0,5,4,3); } maxInFour2.onclick=function (){ maxInFour2.innerHTML=getMax(2,2,1,4,5,1,0,8,0,5,4,3); } </script>
在这部分中,我们定义了一个名为
getMax
的函数,该函数使用了JavaScript中的arguments
对象,这个对象包含了所有传入函数的参数。接着,我们获取了两个DOM元素(id为max1
和max2
)并为它们分别绑定了click
事件处理程序,当用户点击这些元素时,会调用getMax
函数并更新相应的单元格内容。
🎯核心代码
<h1 align='center'>利用arguments求任意个数的最大值</h1>
<table>
<tr>
<td>学院:</td>
<td>软件学院</td>
</tr>
<!-- 其余表格行 -->
</table>
<script>
// JavaScript 代码
</script>
🎯效果展示
点击前:
点击后