驰够网官方网站,上海网警,企业展示网站建设,西安 网站建设 费用编程笔记 html5cssjs 003 协作、约定与标准 50以内的乘法算式 一、代码二、解释 综合应用代码示例。50以内的乘法算式。 一、代码
!DOCTYPE html
html langen
headtitle20以内的乘法/titlemeta charsetcssjs 003 协作、约定与标准 50以内的乘法算式 一、代码二、解释 综合应用代码示例。50以内的乘法算式。 一、代码
!DOCTYPE html
html langen
headtitle20以内的乘法/titlemeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0styletable {border-collapse: collapse;width: 100%;}th, td {border: 1px solid black;padding: 8px;text-align: left;}/stylescript/*** 生成1到19以内乘法的表格*/function generateAdditionEquations() {let html ;for(let i 1; i 19; i) {html tr;for(let j 1; j i; j) {// 每九个算式换一行以保持表格的整洁if((j % 10) 1) {html tr;}html td${j} * ${i} ${i*j}/td;// 当j是10的倍数或者j等于i时结束当前行的绘制if((j % 10) 0 || i j) {html /tr;}}html /tr;}// 将生成的HTML表格代码注入到页面中document.getElementById(additionTable).innerHTML html;}// 页面加载完成后自动调用generateAdditionEquations函数window.onload generateAdditionEquations;/script
/head
body!-- 乘法表格将在这里显示 --table idadditionTabletbody/tbody/table
/body
/html二、解释
这段HTML代码定义了一个页面该页面在加载完成后会自动生成一个乘法表格展示1到19以内的乘法算式。生成的表格样式为整洁的网格状每个乘法算式都以单元格的形式呈现。 具体实现上通过JavaScript函数generateAdditionEquations来生成HTML代码字符串然后将其注入到页面指定的元素中。函数使用嵌套的循环遍历1到19之间的数字生成对应的乘法算式并按照每九个算式换一行的规则来组织表格的行。 页面加载完成后通过window.onload事件自动调用generateAdditionEquations函数确保乘法表格能及时生成并显示在页面上。
