企业官网建设流程全解析

丝绸之路网站平台建设,自助建网站工具,遵义新闻在线第一网,阿里网站建设视频教程练习一#xff1a;综合成绩统计与评级系统 编写一个名为 analyzeGrades 的函数#xff0c;该函数接收一个包含若干学生成绩#xff08;0-100之间的数字#xff09;的数组作为参数。请完成以下功能#xff1a; 数据清洗#xff1a;过滤掉数组中无效的数据#xff08;非数…练习一综合成绩统计与评级系统编写一个名为 analyzeGrades 的函数该函数接收一个包含若干学生成绩0-100之间的数字的数组作为参数。请完成以下功能数据清洗过滤掉数组中无效的数据非数字类型、小于0或大于100的数值将有效成绩存入一个新数组。基础统计计算有效成绩的总分、平均分、最高分和最低分。等级判定遍历有效成绩数组根据分数段判断等级90-100为“优”80-89为“良”60-79为“中”60以下为“差”并统计各等级的人数。结果返回返回一个对象包含有效成绩数组、总分、平均分、最高分、最低分以及等级统计对象。!DOCTYPE html html langzh-CN head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 title综合成绩统计与评级系统/title style *{margin:0;padding:0;box-sizing:border-box;font-family:微软雅黑,sans-serif;}body{max-width:800px;margin:50px auto;padding:0 20px;background-color:#f5f5f5;}.container{background:white;padding:30px;border-radius:10px;box-shadow:0 2px 10pxrgba(0,0,0,0.1);}h1{text-align:center;color:#333;margin-bottom:30px;}.input-area{margin-bottom:20px;}textarea{width:100%;height:100px;padding:10px;border:1px solid #ddd;border-radius:5px;resize:none;font-size:16px;}button{display:block;width:100%;padding:12px;background-color:#4CAF50;color:white;border:none;border-radius:5px;font-size:16px;cursor:pointer;}button:hover{background-color:#45a049;}.result-area{margin-top:30px;padding:20px;background-color:#f9f9f9;border-radius:5px;}.result-item{margin-bottom:10px;font-size:16px;}.result-item span{font-weight:bold;color:#333;}/style /head body div classcontainer h1综合成绩统计与评级系统/h1 div classinput-area textarea idgradeInput placeholder请输入学生成绩用逗号分隔例如95,88,72,55,80/textarea /div button idanalyzeBtn分析成绩/button div idresult classresult-area div classresult-item有效成绩span idvalidGrades/span/div div classresult-item总分span idtotalScore/span/div div classresult-item平均分span idaverageScore/span/div div classresult-item最高分span idmaxScore/span/div div classresult-item最低分span idminScore/span/div div classresult-item优span idgradeExcellent/span 人/div div classresult-item良span idgradeGood/span 人/div div classresult-item中span idgradeMedium/span 人/div div classresult-item差span idgradePoor/span 人/div /div /div script function analyzeGrades(grades){// 1. 数据清洗 const validGrades grades.filter(grade typeof grade number !isNaN(grade) grade 0 grade 100);// 2. 基础统计 let totalScore 0;let averageScore 0;let maxScore 0;let minScore 0;const validCount validGrades.length;if (validCount 0){totalScore validGrades.reduce((sum,score) sum score,0);averageScore (totalScore / validCount).toFixed(2)* 1;maxScore Math.max(...validGrades);minScore Math.min(...validGrades);}// 3. 等级判定 const gradeStats {优:0,良:0,中:0,差:0}; validGrades.forEach(score {if(score 90)gradeStats.优;else if(score 80)gradeStats.良;else if(score 60)gradeStats.中;else gradeStats.差;});return{validGrades,totalScore,averageScore,maxScore,minScore,gradeStats};}// 4. 绑定按钮事件 document.getElementById(analyzeBtn).addEventListener(click, function(){const inputStr document.getElementById(gradeInput).value.trim();if (!inputStr){alert(请输入成绩数据);return;}// 解析输入处理逗号和空格 const gradeArray inputStr.split(,).map(item Number(item.trim()));const result analyzeGrades(gradeArray);// 填充结果 document.getElementById(validGrades).textContent result.validGrades.join(, );document.getElementById(totalScore).textContent result.totalScore;document.getElementById(averageScore).textContent result.averageScore;document.getElementById(maxScore).textContent result.maxScore;document.getElementById(minScore).textContent result.minScore;document.getElementById(gradeExcellent).textContent result.gradeStats.优;document.getElementById(gradeGood).textContent result.gradeStats.良;document.getElementById(gradeMedium).textContent result.gradeStats.中;document.getElementById(gradePoor).textContent result.gradeStats.差;});/script /body /html运行呈现练习二寻找“完数”题目描述一个数如果恰好等于它的所有真因子即除了自身以外的约数之和这个数就被称为“完数”。例如6 1 2 3所以6是完数。请编写一个函数 findPerfectNumbers(start, end)找出并返回 start 到 end 范围内包含两头所有的完数组成的数组。要求函数接收两个数字参数 start 和 end。使用嵌套循环外层循环遍历范围内的每一个数字内层循环寻找该数字的因子。如果该数是完数将其存入结果数组。返回该数组。!DOCTYPE html html langzh-CN head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 title寻找完数工具/title style *{margin:0;padding:0;box-sizing:border-box;font-family:微软雅黑,sans-serif;}body{max-width:600px;margin:50px auto;padding:0 20px;background-color:#f5f5f5;}.container{background:white;padding:30px;border-radius:10px;box-shadow:0 2px 10pxrgba(0,0,0,0.1);}h1{text-align:center;color:#333;margin-bottom:30px;font-size:24px;}.input-group{margin-bottom:20px;}label{display:block;margin-bottom:8px;color:#555;font-size:16px;}input{width:100%;padding:10px;border:1px solid #ddd;border-radius:5px;font-size:16px;}button{width:100%;padding:12px;background-color:#28a745;color:white;border:none;border-radius:5px;cursor:pointer;font-size:18px;transition:background-color 0.3s;margin-top:10px;}button:hover{background-color:#218838;}.result-area{margin-top:30px;padding:20px;background-color:#f8f9fa;border-radius:5px;display:none;}.result-area h2{color:#333;margin-bottom:15px;font-size:18px;}.result-text{font-size:16px;line-height:1.6;color:#555;}.result-text span{font-weight:bold;color:#28a745;}.tip{color:#999;font-size:14px;margin-top:10px;text-align:center;}.error{color:#dc3545;font-size:14px;margin-top:5px;display:none;}/style /head body div classcontainer h1寻找完数工具/h1 div classinput-group label forstartNum范围起始值/label input typenumber idstartNum placeholder请输入起始数字(如1) div classerror idstartError请输入有效的正整数/div /div div classinput-group label forendNum范围结束值/label input typenumber idendNum placeholder请输入大于等于起始值的正整数(如100) div classerror idendError请输入大于等于起始值的正整数/div /div button idfindBtn查找完数/button p classtip提示完数是指等于自身所有真因子之和的数(如6123)/p div classresult-area idresultArea h2查找结果/h2 div classresult-text idresultText/div /div /div script function findPerfectNumbers(start, end){const perfectNumbers [];for(let num start;num end;num){if(num 2)continue;let sumOfFactors 0;for(let i 1;i num / 2;i){if (num % i 0){sumOfFactors i;}}if (sumOfFactors num){perfectNumbers.push(num);}}return perfectNumbers;}const startNumInput document.getElementById(startNum);const endNumInput document.getElementById(endNum);const findBtn document.getElementById(findBtn);const resultArea document.getElementById(resultArea);const resultText document.getElementById(resultText);const startError document.getElementById(startError);const endError document.getElementById(endError);function hideAllErrors(){startError.style.display none;endError.style.display none;}findBtn.addEventListener(click, () {hideAllErrors();resultArea.style.display none;const start Number(startNumInput.value.trim());const end Number(endNumInput.value.trim());if (isNaN(start) || start 1){startError.style.display block;return;}if (isNaN(end) || end start){endError.style.display block;return;}const perfectNumbers findPerfectNumbers(start,end);let resultHtml ;if (perfectNumbers.length 0){resultHtml 在 span${start}/span 到 span${end}/span 范围内未找到完数;}else{resultHtml 在 span${start}/span 到 span${end}/span 范围找到的完数有br;perfectNumbers.forEach(num {let factors [];for(let i 1;i num / 2;i){if(num % i 0)factors.push(i);}resultHtml ${num}(${factors.join( )})br;});}resultText.innerHTML resultHtml;resultArea.style.display block;});/script /body /html运行呈现练习三数组合并与去重题目描述编写一个函数 mergeArrays(arr1, arr2)将两个数组合并成一个新的数组并去除其中重复的数字如果两个数组中有相同的数字新数组中只保留一个。要求函数接收两个数组参数 arr1 和 arr2。创建一个空数组 result 用于存放结果。先将 arr1 中的所有元素添加到 result 中。再遍历 arr2对于 arr2 中的每一个元素检查它在 arr1 或 result 中是否已经存在。如果不存在才将其添加到 result 中。返回 result。示例输入mergeArrays([1, 2, 3], [2, 3, 4, 5])输出[1, 2, 3, 4, 5]在这里!DOCTYPE html html langzh-CN head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 title数组合并与去重工具/title style *{margin:0;padding:0;box-sizing:border-box;font-family:微软雅黑,sans-serif;}body{max-width:700px;margin:50px auto;padding:0 20px;background-color:#f5f5f5;}.container{background:white;padding:30px;border-radius:10px;box-shadow:0 2px 10pxrgba(0,0,0,0.1);}h1{text-align:center;color:#333;margin-bottom:30px;font-size:24px;}.input-group{margin-bottom:20px;}label{display:block;margin-bottom:8px;color:#555;font-weight:500;font-size:16px;}textarea{width:100%;height:80px;padding:10px;border:1px solid #ddd;border-radius:5px;resize:none;font-size:16px;}button{width:100%;padding:12px;background-color:#007bff;color:white;border:none;border-radius:5px;cursor:pointer;font-size:18px;transition:background-color 0.3s;margin-top:10px;}button:hover{background-color:#0056b3;}.result-area{margin-top:30px;padding:20px;background-color:#f8f9fa;border-radius:5px;display:none;}.result-area h2{color:#333;margin-bottom:15px;font-size:18px;}.result-text{font-size:16px;color:#555;line-height:1.6;padding:10px;background-color:white;border-radius:5px;border:1px solid #eee;}.result-text span{font-weight:bold;color:#007bff;}.tip{color:#999;font-size:14px;margin-top:10px;text-align:center;}.error{color:#dc3545;font-size:14px;margin-top:5px;display:none;}/style /head body div classcontainer h1数组合并与去重工具/h1 div classinput-group label forarr1Input第一个数组元素用英文逗号分隔/label textarea idarr1Input placeholder请输入有效的数组元素用英文逗号分隔/textarea div classerror idarr1Error请输入有效的数组元素用英文逗号分隔/div /div div classinput-group label forarr2Input第二个数组元素用英文逗号分隔/label textarea idarr2Input placeholder请输入有效的数组元素用英文逗号分隔/textarea div classerror idarr2Error请输入有效的数组元素用英文逗号分隔/div /div button idmergeBtn合并并去重/button p classtip提示支持数字、字符串等元素重复元素仅保留一个保留原顺序/p div classresult-area idresultArea h2合并去重结果/h2 div classresult-text idresultText/div /div /div script function mergeArrays(arr1, arr2){const result [];// 先加入第一个数组的所有元素 for(let i 0;i arr1.length;i){result.push(arr1[i]);}// 再加入第二个数组中不存在于结果的元素 for(let j 0;j arr2.length;j){let currentElement arr2[j];let isExist false;for(let k 0;k result.length;k){if (result[k] currentElement){isExist true;break;}}if (!isExist){result.push(currentElement);}}return result;}const arr1Input document.getElementById(arr1Input);const arr2Input document.getElementById(arr2Input);const mergeBtn document.getElementById(mergeBtn);const resultArea document.getElementById(resultArea);const resultText document.getElementById(resultText);const arr1Error document.getElementById(arr1Error);const arr2Error document.getElementById(arr2Error);function hideAllErrors(){arr1Error.style.display none;arr2Error.style.display none;}function parseArrayInput(inputStr){if(!inputStr.trim())return [];return inputStr.split(,).map(item {const trimmed item.trim();returnisNaN(Number(trimmed))?trimmed:Number(trimmed);}).filter(item item !);}mergeBtn.addEventListener(click, () {hideAllErrors();resultArea.style.display none;const arr1Str arr1Input.value.trim();const arr2Str arr2Input.value.trim();if (!arr1Str || arr1Str.length 0){arr1Error.style.display block;return;}if (!arr2Str || arr2Str.length 0){arr2Error.style.display block;return;}const arr1 parseArrayInput(arr1Str);const arr2 parseArrayInput(arr2Str);const mergedArray mergeArrays(arr1,arr2);let resultHtml 第一个数组span${arr1.join(, )}/spanbr 第二个数组span${arr2.join(, )}/spanbr 合并去重后span${mergedArray.join(, )}/span ;resultText.innerHTML resultHtml;resultArea.style.display block;});/script /body /html插入代码片呈现