js题

Posted 你看他好像一条狗,

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js题相关的知识,希望对你有一定的参考价值。

<!--计算器-->
请输入数字1: <input type="text" id="n1"><br>
请输入数字2: <input type="text" id="n2"><br>
请选择运算符: 
<select name="" id="fh">
	<option value="+">+</option>
	<option value="-">-</option>
	<option value="*">*</option>
	<option value="/">/</option>
</select><br>
<button id="btn1" onClick="a()">计算</button>结果为: <span id="jg1"></span>
<script>
	function a(){
		var n1 = +document.getElementById("n1").value;
		var n2 = +document.getElementById("n2").value;
		var fh = document.getElementById("fh").value;
		var btn1 = document.getElementById("btn1");
		var str = "";
		switch(fh){
			case "+":
				str = n1 + n2;
				break;
			case "-":
				str = n1 - n2;
				break;
			case "*":
				str = n1 * n2;
				break;
			case "/":
				str = n1 / n2;
				break;
		}
		document.getElementById("jg1").innerhtml = str;
	}
</script>
<!--动态时钟-->
<div id="st"></div>
<script>
	function getDate(){
        var date = new Date();
        var date1 = date.toLocaleString();
        var div1 = document.getElementById("st");
        div1.innerHTML = date1;
        }
        setInterval("getDate()",1000);
</script>
<!--全选全不选-->
<table width="300" border="1">
	<tr>
		<th>
			<input type="checkbox" id="qx" onClick="qx()">全选
		</th>
		<th>姓名</th>
		<th>性别</th>
		<th>年龄</th>
	</tr>
	<tr>
		<td>
			<input type="checkbox" class="xz">
		</td>
		<td>默默</td>
		<td>女</td>
		<td>20</td>
	</tr>
	<tr>
		<td>
			<input type="checkbox" class="xz">
		</td>
		<td>笨笨</td>
		<td>女</td>
		<td>20</td>
	</tr>
	<tr>
		<td>
			<input type="checkbox" class="xz">
		</td>
		<td>娜娜</td>
		<td>女</td>
		<td>20</td>
	</tr>
</table>
<script>
	function qx(){
		var qx = document.getElementById("qx");
		var zhi = qx.checked;
		var xz = document.getElementsByClassName("xz");
		for(var i = 0;i < xz.length;i++){
			xz[i].checked = zhi;
		}
	}
</script>
<!--轮播图-->
<button onClick="sy()" id="syz">上一张</button>
<img src="imgs/300 (1).jpg"  id="tp">
<button onClick="xy()" id="xyz">下一张</button>
<script>
	var syz = null;
	var xyz = null;
	var tp = null;
	var imgs = [];
	var n = null;
	var tm = null;
	window.onload = function(){
		syz = document.getElementById("syz");
		xyz = document.getElementById("xyz");
		tp = document.getElementById("tp");
		imgs = ["imgs/300 (1).jpg","imgs/300 (2).jpg","imgs/300 (3).jpg","imgs/300 (4).jpg","imgs/300 (5).jpg"];
		n = 0;
		tm = setInterval(xy,3000);
		tp.onmouseover = function(){
			clearInterval(tm);
		}
		tp.onmouseout = function(){
			tm = setInterval(xy,3000);
		}
	}
	function sy(){
		n--;
		if(n < 0){
			n = imgs.length - 1;
		}
		for(var i = 0;i < imgs.length;i++){
			tp.setAttribute("src",imgs[n]);
		}
	}
	function xy(){
		n++;
		if(n > imgs.length - 1){
			n = 0;
		}
		for(var i = 0;i < imgs.length;i++){
			tp.setAttribute("src",imgs[n]);
		}
	}
</script>
<!--36选7-->
<div id="szs"></div>
<button onClick="ks()">开始</button><span id="sjjg"></span>
<script>
	function xxx(){
		var str = "";
		for(var i = 1;i < 37;i++){
			str += i + ‘,‘;
		}
		document.getElementById("szs").innerHTML = str;
	}
	xxx();
	function ks(){
		var stt = "";
		for(i = 0;i < 7;i++){
			var zhi = parseInt(Math.random()*36)+1;
			if(stt.indexOf(zhi) == -1){
				stt += zhi + ",";
			}else{
				i--;
			}
		}
		document.getElementById("sjjg").innerHTML = stt;
	}
	
</script>
<!--验证码-->
<br>验证码: <span id="mmm"></span><br>
请输入验证码: <input type="text" id="srrr"> <br>
<button onClick="yy()">验证</button><span id="nnn"></span>
<script>
	function ll(){
		var zfs = "123456asdfgh";
		zfs = zfs.split("");
		var str = "";
		for(var i = 0;i < 4;i++){
			var zhi = parseInt(Math.random()*zfs.length);
			str += zfs[zhi];
		}
		document.getElementById("mmm").innerHTML = str;
	}
	ll();
	function yy(){
		var yzm = document.getElementById("mmm").innerHTML;
		var srr = document.getElementById("srrr").value;
		if(yzm == srr){
			document.getElementById("nnn").innerHTML = "输入正确";
		}else{
			document.getElementById("nnn").innerHTML = "输入错误";
		}
	}
	
	
</script>
<!--表格添加删除-->
<table width="300" border="1" id="tab">
	<tr>
		<th onClick="change(this)">年级</th>
		<th onClick="change(this)">姓名</th>
		<th onClick="change(this)">性别</th>
		<th onClick="change(this)">操作</th>
	</tr>
	<tr>
		<td onClick="change(this)">1</td>
		<td onClick="change(this)">找找</td>
		<td onClick="change(this)">女</td>
		<td>
			<button onClick="del(this)" class="scc">删除</button>
		</td>
	</tr>
	<tr>
		<td onClick="change(this)">2</td>
		<td onClick="change(this)">等等</td>
		<td onClick="change(this)">女</td>
		<td>
			<button onClick="del(this)" class="scc">删除</button>
		</td>
	</tr>
	<tr>
		<td onClick="change(this)">3</td>
		<td onClick="change(this)">肉肉</td>
		<td onClick="change(this)">女</td>
		<td>
			<button onClick="del(this)" class="scc">删除</button>
		</td>
	</tr>
</table>
<button onClick="add()" id="cre">添加</button>
<script>
	function add(){
		var tab = document.getElementById("tab");
		tab.innerHTML += `<tr>
		<td onClick="change(this)">4</td>
		<td onClick="change(this)">星星</td>
		<td onClick="change(this)">女</td>
		<td>
			<button onClick="del(this)" class="scc">删除</button>
		</td>
	</tr>`
	}
	function del(obj){
		obj.parentElement.parentElement.remove();
	}
</script>

  

以上是关于js题的主要内容,如果未能解决你的问题,请参考以下文章

VSCode自定义代码片段——JS中的面向对象编程

VSCode自定义代码片段9——JS中的面向对象编程

js代码片段: utils/lcoalStorage/cookie

JS代码片段:一个日期离现在多久了

js常用代码片段(更新中)

js常用代码片段