javascript

最新推荐文章于 2024-07-15 23:20:19 发布

上了年纪的人还能怎样

最新推荐文章于 2024-07-15 23:20:19 发布

阅读量142

点赞数

本文链接：https://blog.csdn.net/weixin_43912996/article/details/113799849

版权

javascript语言主要是完成页面的数据验证。因此它运行在客户端，需要运行在浏览器来解析执行javascript代码。
特点
交互性
安全性
跨平台性
案例一

<script type="text/javascript">
alert("hello  word");
</script>

变量
JavaScript的变量类型
数值类型 number
字符串类型 string
对象类型 object
布尔类型 boolean
函数类型 function

函数的定义

function  函数名(形参){
函数体
}
//第一种方式
<script type="text/javascript">
function a(){
	alert("hello")
}

function a1(a,b){
	alert("hello")
}
a();
</script>
//第二种方式
var  fun=function(){
	alert("无参数函数")
}

onload事件

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function onloadFun(){
	alert("静态注册onload事件")
}
</script>
</head>
<body onload="onloadFun()">

</body>
</html>

动态事件

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
    window.onload=function(){
    	alert("动态注册onload事件")
    }
</script>
</head>
<body>

</body>
</html>

onclick事件

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
    function onclickFun(){
    	alert("静态注册onload事件")
    }
</script>
</head>
<body>
   <button  onclick="onclickFun()">按钮</button>
</body>
</html>

动态onclick事件

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
    window.onload=function(){
    	 var  btn=document.getElementById("btn");
    	 btn.onclick=function(){
    		 alert("动态onclick事件")
    	 }
    }
    
</script>
</head>
<body>
   <button  id="btn">按钮</button>
</body>
</html>

onblur事件

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
    function onblurfun(){
    	console.log("静态焦点");
    }
    window.onload=function(){
      var pwd=	document.getElementById("pwd");
      pwd.onblur=function(){
    	  console.log("动态失去焦点事件")
      }
    }
</script>
</head>
<body>
  用户名:<input type="text" onblur="onblurfun()"><br/>
  密 码:<input type="text" id="pwd"><br/>
</body>
</html>

onsubmit事件

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
    function onsubmitFun(){
    	alert("静态注册")
    	return false;
    }
    window.onload=function(){
      var pwd=	document.getElementById("onsubmitFun");
      pwd.onsubmit=function(){
    	  alert("动态注册")
    	  return false;
      }
    }
</script>
</head>
<body>
  <form action="" method="get" onsubmit="return onsubmitFun()">
     <input type="submit" value="静态注册">
  </form>
  
   <form action="" id="onsubmitFun">
     <input type="submit" value="动态注册">
  </form>
</body>
</html>