2个回答
展开全部
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>RunJS</title>
<style>
#result>div{
float:left;
}
#result>ul{
list-style-type: none;
float:left;
}
</style>
<script>
var calc = function(){
var uls = result.getElementsByTagName("ul");
var divs = result.getElementsByTagName("div");
uls[0].innerHTML = "";
var ul = document.createElement("ul");
for(var i=1;i<10;i++){
var li = document.createElement("li");
li.innerHTML = txt.value + "x" + i + "=" + txt.value * i;
uls[0].appendChild(li);
ul.appendChild(li.cloneNode(1));
divs[0].insertBefore(ul,divs[0].children[0]);
}
};
</script>
</head>
<body>
Enter a integer from 1 to 9:
<input type="text" id="txt" />
<input type="button" onclick="calc()" value="Genterate times table" />
<div id="result">
<ul>
</ul>
<div>
</div>
</div>
</body>
</html>
追问
下面只有两排结果,没输入时,都是空白,输入一次只有一排,输入第二次才会左边新数据,右面旧数据,右面会随之更新,这样的能实现吗
追答
<script>
var calc = function(){
var uls = result.getElementsByTagName("ul");
var divs = result.getElementsByTagName("div");
uls[1].innerHTML = uls[0].innerHTML;
uls[0].innerHTML = "";
for(var i=1;i<10;i++){
var li = document.createElement("li");
li.innerHTML = txt.value + "x" + i + "=" + txt.value * i;
uls[0].appendChild(li);
}
};
</script>
</head>
<body>
Enter a integer from 1 to 9:
<input type="text" id="txt" />
<input type="button" onclick="calc()" value="Genterate times table" />
<div id="result">
<ul>
</ul>
<ul>
</ul>
</div>
</body>
</html>
2017-10-04
展开全部
<!DOCTYPE html>
<html lang="en">
<head>
<script>
var old = -1;
var formats = "{0}x{1} = {2}";
function formatString(fStr, i1, i2, i3) {
return fStr.replace('{0}', i1).replace('{1}', i2).replace('{2}', i3)
}
function test() {
var inp = document.getElementById("num");
var show = document.getElementById("show");
var oldshow = document.getElementById("oldshow");
while (show.hasChildNodes())
{
show.removeChild(show.firstChild);
}
var num = parseInt(inp.value);
for (var i = 1; i <= 9; i++) {
var c = document.createElement("div");
var old = document.createElement("div");
c.innerText = formatString(formats, num, i, i * num);
old.innerText = formatString(formats, num, i, i * num);
oldshow.appendChild(old);
show.appendChild(c);
}
}
</script>
</head>
<body>
<div style="float:left;width:100%">
<input id="num" /> <button onclick="test()">sub</button>
</div>
<div id="show" style="float:left;width:400px">
</div>
<div id="oldshow" style="float:left;width:400px">
</div>
</body>
</html>
<html lang="en">
<head>
<script>
var old = -1;
var formats = "{0}x{1} = {2}";
function formatString(fStr, i1, i2, i3) {
return fStr.replace('{0}', i1).replace('{1}', i2).replace('{2}', i3)
}
function test() {
var inp = document.getElementById("num");
var show = document.getElementById("show");
var oldshow = document.getElementById("oldshow");
while (show.hasChildNodes())
{
show.removeChild(show.firstChild);
}
var num = parseInt(inp.value);
for (var i = 1; i <= 9; i++) {
var c = document.createElement("div");
var old = document.createElement("div");
c.innerText = formatString(formats, num, i, i * num);
old.innerText = formatString(formats, num, i, i * num);
oldshow.appendChild(old);
show.appendChild(c);
}
}
</script>
</head>
<body>
<div style="float:left;width:100%">
<input id="num" /> <button onclick="test()">sub</button>
</div>
<div id="show" style="float:left;width:400px">
</div>
<div id="oldshow" style="float:left;width:400px">
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询