Javascript之经典小案例_javascript小案列-CSDN博客

本文链接：https://blog.csdn.net/weixin_39843945/article/details/89094262

（1）动态显示当前系统时间

<body>
	<p>当前时间：<span id="times"></span></p>
</body>
<script>
	function get(){
		var date=new Date();
		var d1=date.toLocaleString();
		times.innerHTML=d1;
		}
	setInterval("get()",1000);
</script>
</html>

关于JavaScript Date（日期）对象

在这里插入图片描述

2）复选框的全选/全不选/反选

<body>
	<input type="checkbox"name="love"/>篮球
	<input type="checkbox"name="love"/>排球
	<input type="checkbox"name="love"/>羽毛球
	<input type="checkbox"name="love"/>乒乓球
	<br/>
	<input type="button" value="全选" onclick="selAll()">
	<input type="button" value="全不选" onclick="selNo()">
	<input type="button" value="反选" onclick="selOther()">
</body>
	<script>
	function selAll(){
		var all=document.getElementsByName("love");
		for(var i=0;i<all.length;i++){
			var a=all[i];
			a.checked=true;
		}
	}
	
	function selNo(){
		var all=document.getElementsByName("love");
		for(var i=0;i<all.length;i++){
			var a=all[i];
			a.checked=false;
		
		}
	}
	function selOther(){
		var all=document.getElementsByName("love");
		for(var i=0;i<all.length;i++){
			var a=all[i];
			a.checked=!a.checked;
	
		}
	}
	</script>

在这里插入图片描述

（3）省市联动

创建一个页面，有两个下拉选择框
- 在第一个下拉框里面有一个事件：改变事件 onchange事件
  – 方法changeCity(this.value);表示当前改变的option里面的value值
- 创建一个二维数组，存储数据
  – 每个数组中第一个元素是国家名称，后面的元素是国家里面的城市*
  /*
  1、遍历二维数组
  2、得到也是一个数组（国家对应关系）
  3、拿到数组中的第一个值和传递过来的值做比较
  4、如果相同，获取到第一个值后面的元素
  5、得到city的select
  6、添加过