前端HTML代码重复怎么办

html-css018

前端HTML代码重复怎么办,第1张

对于重复用到的<div class="header">和<div class=footer>,可以单独提取出来做单独的页面。

header和footer分别的头部盒子和底部盒子;前者一般包括nav,logo,登录入口等,底部文件一般是链接,声明等。

在html页面中直接引入就行了,这样不仅避免了代码重复,更是在往后,需求变更后,方便维护,而不需要再每个都有header和footer的地方,一个个的修改。

把函数值留一个 改成传参的方式

function on_hide(num){

 document.getElementById("suanfa"+num).style.display = (document.getElementById("times"+num).checked == true) ? "block" : "none"

}

<label><input  type="checkbox" value="hours" id="times1" onclick="on_hide(1)"/>时</label> 

<label><input  type="checkbox" value="day" id="times2" onclick="on_hide(2)"/>日 </label> 

<label><input  type="checkbox" value="week" id="times3" onclick="on_hide(3)"/>周 </label> 

<label><input  type="checkbox" value="month" id="times4" onclick="on_hide(4)"/>月 </label> 

<label><input  type="checkbox" value="season" id="times5" onclick="on_hide(5)"/>季 </label>