js之表格api：99乘法表

最新推荐文章于 2024-05-20 09:24:37 发布

名字到底多长

最新推荐文章于 2024-05-20 09:24:37 发布

阅读量1.3k

点赞数

分类专栏：来自cj的js练手

本文链接：https://blog.csdn.net/mingzidaodiduochang/article/details/8134246

版权

来自cj的js练手专栏收录该内容

6 篇文章 0 订阅

订阅专栏

table： insertRow 返回插入的row rows属性

row： insertCell 返回插入的cell cells属性

<script type="text/javascript">
	window.onload =function(){
		
		var inputs = document.getElementsByTagName("input");
		inputs[2].onclick =function(evt){
			/**
				evt.preventDefault()
				window.event.returnValue = false;
			*/
			drawTable(+inputs[0].value,+inputs[1].value);
		}
	
	};
	function drawTable(start,end){
		if(isNaN(start)||isNaN(end)){
			alert("输入非数字");
		}else{
			var table = document.createElement('table');
			table.border = "1";
			for(var i=start;i<=end;i++){
				//insertRow  返回row  rows属性
				var row = table.insertRow(table.rows.length);
				for(var j=start;j<=end;j++){
				//insertCell 返回cell  cells属性
					var cell = row.insertCell(row.cells.length);
					if(j<=i){
						cell.innerHTML = j+"*"+i+"="+i*j;
					}else{
						cell.innerHTML = " "
					}
						
				}
			}
			document.body.appendChild(table);
		}
	}
</script>
<style type="text/css">
	
</style>
<title></title>
<body>
	<input type="text"/><input type='text'/><input type="button" value="生成表格"/>
</body>