码迷,mamicode.com
首页 > Web开发 > 详细

HTML学习笔记四

时间:2016-06-14 08:48:38      阅读:271      评论:0      收藏:0      [点我收藏+]

标签:

今日学习内容为:

 

 

1.文本域操作

<html>
    <head>
	<meta charset="utf-8"/>
	<title>JavaScript4</title>
	<script type="text/javascript" language="javascript">
		function fun()
		{
			var max = 20;
			var curr = document.getElementById("note").value.length;
			if(curr < max)
			{
				document.getElementById("msg").innerHTML = "您可以输入" + (max - curr) + "个字";
				document.getElementById("sub").disabled = false;
			}
			else
			{
			    document.getElementById("msg").innerHTML = "<font color=\"red\">您的输入内容过长,请修改。</font>";
				document.getElementById("sub").disabled = true;
			}
		}
	</script>
	</head>
	<body>
		<form action="javascript3.html" name="myform">
			<textarea name="note" cols="30" rows="6" onkeydown="fun()" onkeyup="fun()">
			</textarea>
			<br/>
			<span id="msg">您可以输入20个字</span>
			<input type="submit" name="sub">
		</form>
	</body>
</html>

  

2.表格操作

<html>
	<head>
	   <title>JavaScript5</title>
	   <script type="text/javascript" language="javascript">
	      function createTable()
		  {
			document.write("<table border=\"1\">");
			for(var i=1;i<=9;i++)
			{
				document.write("<tr>");
					for(var j=1;j<i;j++)
					{
					   document.write("<td>"+i+"*"+j+"="+(i*j)+"</td>");
						
					}
					for(var j=1;j<9-i;j++)
					{
						document.write("<td> </td>")
					}
				document.write("</tr>");
			}
		  }
	   </script>
	</head>
	<body>
		<input type="button" value="生成乘法口诀" onclick="createTable()"/>
	</body>
</html>

  

 

HTML学习笔记四

标签:

原文地址:http://www.cnblogs.com/pony1223/p/5582676.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!