华润置地建设事业部官方网站,首京建设投资引导基金网站,做电脑端网站手机端能搜到吗,推广网站建设#x1f38a;专栏【 前端易错合集】 #x1f354;喜欢的诗句#xff1a;更喜岷山千里雪 三军过后尽开颜。 #x1f386;音乐分享【如愿】 大一同学小吉#xff0c;欢迎并且感谢大家指出我的问题#x1f970; #x1f354;介绍
就是在输入框中输入数字后#xff0c;再按… 专栏【 前端易错合集】 喜欢的诗句更喜岷山千里雪 三军过后尽开颜。 音乐分享【如愿】 大一同学小吉欢迎并且感谢大家指出我的问题 介绍
就是在输入框中输入数字后再按下按钮系统会自动出现表格 代码 !-- 创建一个基本的HTML页面 -- !DOCTYPE html html langen head meta charsetUTF-8 !-- 定义文档的字符集 -- meta http-equivX-UA-Compatible contentIEedge !-- 指定用于Internet Explorer的最新版本 -- meta nameviewport contentwidthdevice-width, initial-scale1.0 !-- 使页面自适应不同的设备尺寸 -- titleDocument/title !-- 设置页面的标题 -- !-- 定义表格和d1的样式 -- style fieldset,#d1 { padding: 10px; width: 300px; margin: 0 auto; } /style !-- 定义JavaScript代码用于创建HTML表格 -- script typetext/javascript function createTable(){ n1; var strtable width100% border1 cellspacing0 cellpadding0tbody; // 获取用户输入的行数和列数 var r1document.getElementById(row).value; var c1document.getElementById(col).value; // 构建一个简单的HTML表格 for(i0;ir1;i) { strstrtr aligncenter; for(j0;jc1;j) { strstrtd(n)/td; } strstr/tr; } // 将生成的表格插入到id为“d1”的div元素中 var d1document.getElementById(d1); d1.innerHTMLstr/tbody/table; } /script /head !-- 定义HTML表单和一个div元素 -- body form idform1 nameform1 methodpost action fieldset legend按时/legend !-- 用户输入行数和列数 -- 输入表格的行数:input typetext idrow br 输入表格的列数:input typetext idcol br !-- 单击按钮将生成表格 -- input typebutton idok value产生表格 οnclickcreateTable()/ /fieldset /form !-- 表格将插入到这个id为d1的div元素中 -- div idd1/div /body /html 解释
为什么要用”str“
str 的作用是将字符串连接起来。在代码中使用 str 将每一行的 HTML 字符串拼接起来最终生成完整的 HTML 表格。
在实现动态生成表格功能时需要不断拼接 HTML 代码并不断更新页面内容。对于 JavaScript 来说每次更新 HTML 代码都需要重新构建整个 HTML 结构这非常费时且容易出错。而使用 str 可以更加高效、方便地拼接字符串目的是为了减少代码的复杂性和提高代码的执行效率。
因此在上述代码中使用 str 将表格的每一行 HTML 代码拼接起来最终生成完整的 HTML 表格并将其插入到 id 为 d1 的 div 元素中。
d1.innerHTML
这个d1.innerHTML不能改为别的东西
d1.innerHTML 的作用是设置或获取指定元素中包含的 HTML 内容。在上述代码中使用 d1.innerHTML 将包含完整 HTML 表格的字符串插入到 id 为 d1 的 div 元素中。
具体来说d1 是一个代表 id 为 d1 的 div 元素的变量在函数 createTable() 中使用 getElementById() 方法获取。然后在生成完整的 HTML 表格的过程中将其保存在一个名为 str 的 JavaScript 变量中。最后将 str 中保存的 HTML 字符串使用 d1.innerHTML str 的方式插入到 id 为 d1 的 div 元素中从而实现将动态生成的表格显示在页面上的效果。
总之使用 d1.innerHTML str 可以非常方便地将动态生成的 HTML 代码插入到指定的元素中从而实现动态修改网页内容的效果。 如果大家有不明白的地方或者文章有问题欢迎大家在评论区讨论指正
