慕粉3491582
2018-09-18 10:58
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<body>
<form>
请选择你爱好:<br>
<input type="checkbox" name="hobby" id="hobby1"> 音乐
<input type="checkbox" name="hobby" id="hobby2"> 登山
<input type="checkbox" name="hobby" id="hobby3"> 游泳
<input type="checkbox" name="hobby" id="hobby4"> 阅读
<input type="checkbox" name="hobby" id="hobby5"> 打球
<input type="checkbox" name="hobby" id="hobby6"> 跑步 <br>
<input type="button" value = "全选" onclick = "checkall();">
<input type="button" value = "全不选" onclick = "clearall();">
<p>请输入您要选择爱好的序号,序号为1-6:</p>
<input id="wb" name="wb" type="text" >
<input name="ok" type="button" value="确定" onclick = "checkone();">
</form>
<script type="text/javascript">
function checkall(){
var hobby = document.getElementsByTagName("input");
for(var i=0;i<hobby.length;i++){
if(hobby[i].type=="checkbox"){
hobby[i].checked=true;
}
}
}
function clearall(){
var hobby = document.getElementsByName("hobby");
// 任务2
for(var i=0;i<hobby.length;i++){
hobby[i].checked=false;
}
}
function checkone(){
var j=document.getElementById("wb").value;
// 任务3
if(j>0&&j<=6)
document.getElementById("hobby"+j).checked=true;
}
else alert("请输入1-6的值");
</script>
</body>
</html>
上面的是我写的 ,
下面这段是我给你改完bug的 你有些符号比如括号没写全
<!-- <!DOCTYPE html>
<html>
<meta charset="UTF-8">
<head></head>
<body>
<form id="form2">
<input type="checkbox" name="test1" value="1"/><span>1</span>
<input type="checkbox" name="test1" value="2"/><span>2</span>
<input type="checkbox" name="test1" value="3"/><span>3</span>
<input type="checkbox" name="test1" value="4"/><span>4</span>
<input type="checkbox" name="test1" value="5"/><span>5</span>
<input type='button' value='提交' onclick="show()"/>
<span>haha</span>
</form>
<script type="text/javascript">
var show = function(){
setTimeout("alert(111)",3000)
}
show();
var obj = document.querySelectorAll("input[name]");
console.log(obj);
</script>
</body>
</html> -->
<!-- <!Doctype html>
<html>
<meta charset="UTF-8">
<body>
<span id="js_onclick">点击</span>
<span id="js_onmouseover">鼠标经过</span>
<span id="js_onmouseout">鼠标移开</span>
<span id="js_onchange">文本框内容改变</span>
<span id="js_onfocus">光标聚焦</span>
</body>
<script type="text/javascript">
var js_onclick = document.getElementById("js_onclick");
var js_onmouseover = document.getElementById("js_onmouseover");
var js_onmouseout = document.getElementById("js_onmouseout");
var js_onchange = document.getElementById("js_onchange");
var js_onfocus = document.getElementById("js_onfocus");
js_onclick.onclick = function(){
alert('点击');
};
js_onmouseover.onmouseover = function(){
alert('鼠标经过');
}
js_onmouseout.onmouseout = function(){
alert('鼠标移开');
}
js_onfocus.onfocus = function(){
alert('光标聚焦');
}
</script>
</html> -->
<!-- <!DOCTYPE html>
<html>
<head>
<title> 事件</title>
<meta charset="UTF-8">
</head>
<body>
<input type='text' id='txt1' />
<select id='select'>
<option value='+'>+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type='text' id='txt2' />
<input type='button' value=' = ' onclick="count();" />
<input type='text' id='fruit' />
</body>
<script type="text/javascript">
function count(){
//获取第一个输入框的值
var txt1 = document.getElementById('txt1').value;
var txt2 = document.getElementById('txt2').value;
//获取第二个输入框的值
//获取选择框的值
var select = document.getElementById("select");
var index = select.selectedIndex;
var select_val = select.options[index].value
alert(txt1);
//获取通过下拉框来选择的值来改变加减乘除的运算法则
//设置结果输入框的值
}
</script>
</html> -->
<!-- <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script type="text/javascript">
var interval;
function clock1(){
interval = setInterval(function(){
var time=new Date();
document.getElementById("clock").value = time;
},1000);
}
</script>
</head>
<body onload="clock1()" >
<form>
<input type="text" id="clock" size="50" />
<input type="button" value="start" onclick="clock1()" />
<input type="button" value="Stop" onclick="clearInterval(interval)" />
</form>
</body>
</html> -->
<!-- <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script type="text/javascript">
var num=0;
var i;
function startCount(){
document.getElementById('count').value=num;
num=num+1;
i=setTimeout("startCount()",1000);
}
function stopCount(){
clearTimeout(i);
}
</script>
</head>
<body>
<form>
<input type="text" id="count" />
<input type="button" value="Start" onclick="startCount()"/>
<input type="button" value="Stop" onclick="stopCount()" />
</form>
</body>
</html> -->
<!-- <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script type="text/javascript">
function GoBack() {
window.history.back(-1);
}
</script>
</head>
<body>
点击下面的锚点链接,添加历史列表项:
<br />
<a href="#target1">第一个锚点</a>
<a name="target1"></a>
<br />
<a href="#target2">第二个锚点</a>
<a name="target2"></a>
<br /><br />
使用下面按钮,实现返回前一个页面:
<form>
<input type="button" value="返回前一个页面" onclick="GoBack();" />
</form>
</body>
</html> -->
<!-- <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script type="text/javascript">
function GoForward() {
window.history.forward();
}
</script>
</head>
<body>
点击下面的锚点链接,添加历史列表项:
<br />
<a href="#target1">第一个锚点</a>
<a name="target1"></a>
<br />
<a href="#target2">第二个锚点</a>
<a name="target2"></a>
<br /><br />
使用下面按钮,实现返回下一个页面:
<form>
<input type="button" value="返回下一个页面" onclick="GoForward()" />
</form>
</body>
</html> -->
<!-- <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>navigator</title>
<script type="text/javascript">
function validB(){
var u_agent = navigator.userAgent;
var B_name="不是想用的主流浏览器!";
if(u_agent.indexOf("Firefox")>-1){
B_name="Firefox";
}else if(u_agent.indexOf("Chrome")>-1){
B_name="Chrome";
}else if(u_agent.indexOf("MSIE")>-1&&u_agent.indexOf("Trident")>-1){
B_name="IE(8-10)";
}
document.write("浏览器:"+B_name+"<br>");
document.write("u_agent:"+u_agent+"<br>");
}
</script>
</head>
<body>
<form>
<input type="button" value="查看浏览器" onclick="validB()" >
</form>
</body>
</html> -->
<!-- <!DOCTYPE html>
<html>
<head>
<title>浏览器对象</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<span id="time">5</span>秒后返回主页<a href="https://baidu.com" target="_blank">返回</a>
<script type="text/javascript">
var start = 5;
var time = document.getElementById("time");
setInterval(function(){
time.innerHTML = start-1;
start--;
if(start<1){
window.location.href="https://baidu.com";
}
},1000);
</script>
</body>
</html> -->
<!-- <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>JavaScript</title>
</head>
<body>
<form name="Input">
<table align="center" width="500px" height="50%" border="1">
<tr>
<td align="center" width="100px">
学号:
</td>
<td align="center" width="300px">
<input type="text" id=userid name="user" onblur="validate();">
<div id=usermsg></div>
</td>
</tr>
<tr>
<td align="center" width="100px">
姓名:
</td>
<td align="center">
<input type="text" name="name">
</td>
</tr>
<tr>
<td align="center" width="%45">
性别:
</td>
<td align="center">
<input type="radio" name="sex" value="男">
男
<input type="radio" name="sex" value="女">
女
</td>
</tr>
<tr>
<td align="center" width="30%">
年龄:
</td>
<td align="center" width="300px">
<input type="text" name="age">
</td>
</tr>
<tr>
<td align="center" width="100px">
地址:
</td>
<td align="center" width="300px">
<input type="text" name="addr">
</td>
</tr>
</table>
</form>
<h1 id="myHead" onclick="getValue()">
看看三种获取节点的方法?
</h1>
<p>
点击标题弹出它的值。
</p>
<input type="button" onclick="getElements()"
value="看看name为sex的节点有几个?" />
<Br>
<input type="button" onclick="getTagElements()"
value="看看标签名为input的节点有几个?" />
<script type="text/javascript">
function getValue()
{
var myH = document.getElementById("myHead");
alert(myH.innerHTML)
}
function getElements()
{
var myS = document.getElementsByName("sex");
alert(myS.length);
}
function getTagElements()
{
var myI = document.getElementsByTagName("input");
alert(myI.length);
}
</script>
</body>
</html> -->
<!-- <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<form>
请选择你爱好:<br>
<input type="checkbox" name="hobby" id="hobby1"> 音乐
<input type="checkbox" name="hobby" id="hobby2"> 登山
<input type="checkbox" name="hobby" id="hobby3"> 游泳
<input type="checkbox" name="hobby" id="hobby4"> 阅读
<input type="checkbox" name="hobby" id="hobby5"> 打球
<input type="checkbox" name="hobby" id="hobby6"> 跑步 <br>
<input type="button" value = "全选" onclick = "checkall();">
<input type="button" value = "全不选" onclick = "clearall();">
<p>请输入您要选择爱好的序号,序号为1-6:</p>
<input id="wb" name="wb" type="text" >
<input name="ok" type="button" value="确定" onclick = "checkone();">
</form>
<script type="text/javascript">
function checkall(){
var hobby = document.getElementsByTagName("input");
for(key in hobby)
hobby[key].checked = true
// 任务1
}
function clearall(){
var hobby = document.getElementsByName("hobby");
for(key in hobby)
hobby[key].checked = false
// 任务2
}
function checkone(){
var j=document.getElementById("wb").value;
var hobby = document.getElementsByTagName("input");
hobby[j-1].checked = true;
// 任务3
}
</script>
</body>
</html> -->
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<form>
请选择你爱好:<br>
<input type="checkbox" name="hobby" id="hobby1"> 音乐
<input type="checkbox" name="hobby" id="hobby2"> 登山
<input type="checkbox" name="hobby" id="hobby3"> 游泳
<input type="checkbox" name="hobby" id="hobby4"> 阅读
<input type="checkbox" name="hobby" id="hobby5"> 打球
<input type="checkbox" name="hobby" id="hobby6"> 跑步 <br>
<input type="button" value = "全选" onclick = "checkall();">
<input type="button" value = "全不选" onclick = "clearall();">
<p>请输入您要选择爱好的序号,序号为1-6:</p>
<input id="wb" name="wb" type="text" >
<input name="ok" type="button" value="确定" onclick = "checkone();">
</form>
<script type="text/javascript">
function checkall(){
var hobby = document.getElementsByTagName("input");
for(var i=0;i<hobby.length;i++){
if(hobby[i].type=="checkbox"){
hobby[i].checked=true;
}
}
}
function clearall(){
var hobby = document.getElementsByName("hobby");
// 任务2
for(var i=0;i<hobby.length;i++){
hobby[i].checked=false;
}
}
function checkone(){
var j=document.getElementById("wb").value;
// 任务3
if(j>0&&j<=6){
document.getElementById("hobby"+j).checked=true;
}
else {alert("请输入1-6的值")};
}
</script>
</body>
</html>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<form>
请选择你爱好:<br>
<input type="checkbox" name="hobby" id="hobby1"> 音乐
<input type="checkbox" name="hobby" id="hobby2"> 登山
<input type="checkbox" name="hobby" id="hobby3"> 游泳
<input type="checkbox" name="hobby" id="hobby4"> 阅读
<input type="checkbox" name="hobby" id="hobby5"> 打球
<input type="checkbox" name="hobby" id="hobby6"> 跑步 <br>
<input type="button" value = "全选" onclick = "checkall();">
<input type="button" value = "全不选" onclick = "clearall();">
<p>请输入您要选择爱好的序号,序号为1-6:</p>
<input id="wb" name="wb" type="text" >
<input name="ok" type="button" value="确定" onclick = "checkone();">
</form>
<script type="text/javascript">
function checkall(){
var hobby = document.getElementsByTagName("input");
for(key in hobby)
hobby[key].checked = true
// 任务1
}
function clearall(){
var hobby = document.getElementsByName("hobby");
for(key in hobby)
hobby[key].checked = false
// 任务2
}
function checkone(){
var j=document.getElementById("wb").value;
var hobby = document.getElementsByTagName("input");
hobby[j-1].checked = true;
// 任务3
}
</script>
</body>
</html>
JavaScript进阶篇
468276 学习 · 21892 问题
相似问题