<!DOCTYPE html><html> ???<head> ???????<meta charset="UTF-8"> ???????<title></title> ???????<style type="text/css"> ???????????div{ ???????????????background-color: lightcyan; ???????????????width: 1000px; ???????????????box-shadow: 5px 5px 1px lightgray; ???????????????margin: auto; ???????????????padding-bottom: 20px; ???????????????????????????} ???????????.one{ ???????????????border: 1px solid gainsboro; ???????????????width: 700px; ???????????????padding: 5px; ???????????????????????????} ???????????.two{ ???????????????border: 1px solid gainsboro; ???????????????width: 700px; ???????????????padding: 5px; ???????????????????????????} ???????????????????????</style> ???</head> ???<body> ???????<div id=""> ???????????innerhtml的使用 ???????????<div class="one"> ???????????????<input type="text" name="" id="tj" value="这里输入文本" /> ???????????????<input type="submit" name="" id="" value="提交" / onclick="aa()"> ???????????</div> ???????????<br /> ???????????????????????<div class="two"> ???????????????????????????</div> ???????</div> ???????<br /> ???????<br /> ???????<br /> ???????<div id=""> ???????????innerhtml的使用、字符串、判断的基本使用 ???????????<div class="one"> ???????????????<input type="text" name="" id="tj1" value="这里输入文本" /> + ????????????????<input type="text" name="" id="tj2" value="这里输入文本" /> ???????????????<input type="submit" name="" id="" value="提交" / onclick="bb()"> ???????????</div> ???????????<br /> ???????????????????????<div class="two"> ???????????????????????????</div> ???????</div> ???????<br /> ???????<br /> ???????<br /> ???????<div id=""> ???????????innerhtml的使用、字符串、判断的基本使用 ???????????<div class="one"> ???????????????<button onclick="cc(0)">提交一</button> ???????????????<button onclick="cc(1)">提交二</button> ???????????????<button onclick="cc(2)">提交三</button> ???????????????<button onclick="cc(3)">提交四</button> ???????????????<button name="quanbu" onclick="cc()">全部弹出提取</button> ???????????</div> ???????????<br /> ???????????????????????<div class="two"> ???????????????????????????</div> ???????</div> ???</body></html><script type="text/javascript"> ???function aa(){ ???????var tjxs = document.getElementsByClassName("two")[0]; ???????var tj = document.getElementById("tj"); ???????tjxs.innerHTML = "提交后在这里显示:"+tj.value; ???} ???function bb(){ ???????var tjxs = document.getElementsByClassName("two")[1]; ???????var tj = document.getElementById("tj"); ???????tjxs.innerHTML = "提交后在这里显示:"+tj1.value+tj2.value; ???} ???????var attr = ["这是第一句","这是第二句","这是第三局","这是第四句"] ???function cc(a){ ???????var tjxs = document.getElementsByClassName("two")[2]; ???????if(a==0){ ???????????tjxs.innerHTML = "提取后在这里显示:"+ attr[a]; ???????} ???????else if(a==1){ ???????????tjxs.innerHTML = "提取后在这里显示:"+ attr[a]; ???????} ???????else if(a==2){ ???????????tjxs.innerHTML = "提交后在这里显示:"+ attr[a]; ???????} ???????else if(a==3){ ???????????tjxs.innerHTML = "提交后在这里显示:"+ attr[a]; ???????} ???????else{ ???????????for(i=0;i<=3;i++){ ???????????alert(attr[i]); ???????????} ???????} ???????????????}</script>
innerhtml的使用
原文地址:https://www.cnblogs.com/yelena-niu/p/8858963.html