【基于HTML5的网页设计及应用】——求学号中的最大数字

最新推荐文章于 2024-08-26 22:34:51 发布

Y小夜

最新推荐文章于 2024-08-26 22:34:51 发布

阅读量971

点赞数 23

分类专栏：基于HTML5的网页设计及应用文章标签： html5 前端 html

本文链接：https://blog.csdn.net/shsjssnn/article/details/136307386

版权

基于HTML5的网页设计及应用专栏收录该内容

25 篇文章 2 订阅

订阅专栏

🎃个人专栏：

🐬 算法设计与分析：算法设计与分析_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>