二、innerHTML应用测试

时间:2021-09-26 23:28:27

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>innerHTML测试页面</title>

<script>

function Test(){
var str="";
str+="Hello,";
str+="This is a Test!<br />";
str+="I Love you;<br />";
str+="I Love you,too!";
p.innerHTML=str+"<br /><br />"+Math.random();
setTimeout('Test();',1000);
}
function chageDiv(number)
{
if (number == 1) {
document.getElementById("div").innerHTML = "值为1";
}
if (number == 2) {
document.getElementById("div").innerHTML = "值为2";
}
}
function chageA(number)
{
if (number == 1) {
document.getElementById("A").innerHTML = "值为1";
}
if (number == 2) {
document.getElementById("A").innerHTML = "值为2";
}
}
</script>

</head>
<body onload="Test()">

<span id="p"></span><br><br>

innerHTML传值测试(DIV块):<br><br>
<div id="div" style="width: 180px;height:120px;color: red ;font-size: 30px;background: green"> DIV块 </div>
<a href="#" onClick="chageDiv(1)">改变值为1</a>
<a href="#" onClick="chageDiv(2)">改变值为2</a><br><br>

innerHTML传值测试(a标签):<a id="A" style="font-size: 38px;color: red"> a标签</a><br>
<a href="#" onClick="chageA(1)">改变值为1</a>
<a href="#" onClick="chageA(2)">改变值为2</a>

<script type="text/javascript">
function chageSpan(number)
{
if (number == 1) {
document.getElementById("span1").innerHTML = "值为1";
}
if (number == 2) {
document.getElementById("span1").innerHTML = "值为2";
}
}
</script>
<br><br>
<div>
Span行测试:

<span id="span1" style="font-size: 30px;color: red">默认值</span><br>
<a href="#" onClick="chageSpan(1)">改变值为1</a>
<a href="#" onClick="chageSpan(2)">改变值为2</a>

</div>