-
<!DOCTYPE HTML>
<html>
? ? <head>
? ? ? ? <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
? ? ? ? <title>無(wú)標(biāo)題文檔</title>
? ? </head>
? ??
? ? <body>
? ? ? ? <form>
? ? ? ? ? 請(qǐng)選擇你愛(ài)好:<br>
? ? ? ? ? <input type="checkbox" name="hobby" id="hobby1">? 音樂(lè)
? ? ? ? ? <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>請(qǐng)輸入您要選擇愛(ài)好的序號(hào),序號(hào)為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");
? ? ? ? ? ?
? ? ? ? ? // 任務(wù)1?
? ? ? ? ? ?for(var i=0;i<hobby.length;i++){
? ? ? ? ? ? ? ?hobby[i].checked=true;
? ? ? ? ? ?}
? ? ? ? }
? ? ? ? function clearall(){
? ? ? ? ? ? var hobby = document.getElementsByName("hobby");
? ? ? ? ? ??
? ? ? ? ?// 任務(wù)2? ??
? ? ? ? ? ? for(var i=0;i<hobby.length;i++){
? ? ? ? ? ? ? ?hobby[i].checked=false;
? ? ? ? ? ?}
? ? ? ? }
? ? ? ??
? ? ? ? function checkone(){
? ? ? ? ? ? var j=document.getElementById("wb").value;
? ? ? ? ? ? var hobby = document.getElementsByName("hobby");
? ? ? ? ?// 任務(wù)3
? ? ? ? ? ? if(j<1 || j>6){
? ? ? ? ? ? ? ? alert("序號(hào)為1-6,請(qǐng)重新輸入")
? ? ? ? ? ? }else{
? ? ? ? ? ? ? ? if(hobby[parseInt(j)-1].checked == false){
? ? ? ? ? ? ? ? ? ? hobby[parseInt(j)-1].checked=true;
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ??
? ? ? ? ? ? }
? ? ? ? }
? ? ? ??
? ? ? ? </script>
? ? </body>
</html>
查看全部 -
<!DOCTYPE html>
<html>
?<head>
? <title>瀏覽器對(duì)象</title>??
? <meta http-equiv="Content-Type" content="text/html; charset=gkb"/>? ?
?</head>
?<body>
? <!--先編寫(xiě)好網(wǎng)頁(yè)布局-->
? <h1>操作成功</h1>
? <span id="time">5</span>
? <span>秒后回到主頁(yè)</span>
? <a href="javascript:back()">返回</a>
? <script type="text/javascript">??
? ?//獲取顯示秒數(shù)的元素,通過(guò)定時(shí)器來(lái)更改秒數(shù)。
? ? var num=document.getElementById("time").innerHTML;
? ? function count(){
? ? ? ? if(num>0){
? ? ? ? ? ? num--;
? ? ? ? ? ? document.getElementById("time").innerHTML=num;
? ? ? ? }else if(num == 0){
? ? ? ? ? ? location.assign("http://idcbgp.cn")
? ? ? ? }
? ? }
? ? function back(){
? ? ? ? window.history.go(-1);
? ? }
? ? setInterval("count()",1000)
? ?//通過(guò)window的location和history對(duì)象來(lái)控制網(wǎng)頁(yè)的跳轉(zhuǎn)。
? ?
?</script>?
</body>
</html>
查看全部 -
<!DOCTYPE? HTML>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>系好安全帶,準(zhǔn)備啟航</title>
<script type="text/javascript">
? //通過(guò)javascript的日期對(duì)象來(lái)得到當(dāng)前的日期,并輸出。
? var date=new Date();
? var weekday=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
? var myDate=date.getFullYear()+"年"+(date.getMonth() + 1)+"月"+date.getDate()+'日 '+ weekday[date.getDay()];
? document.write(myDate + '<br/>');
? //成績(jī)是一長(zhǎng)竄的字符串不好處理,找規(guī)律后分割放到數(shù)組里更好操作哦
? var scoreStr = "小明:87;小花:81;小紅:97;小天:76;小張:74;小小:94;小西:90;小伍:76;小迪:64;小曼:76";
? var achie=scoreStr.split(";");
? ? document.write(achie);
? //從數(shù)組中將成績(jī)撮出來(lái),然后求和取整,并輸出。
? var num=0;
? for(var i=0;i<achie.length;i++){
? ? num+=Number(achie[i].split(":")[1])
? }
? ? document.write('<br/>'+"總分:"+num );
? ? document.write('<br/>'+"平均分:"+Math.round(num/achie.length));
</script>
</head>
<body>
</body>
</html>
查看全部 -
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Math </title>
<script type="text/javascript">
? ? window.onload=function(){
? ? ? ? var b = document.getElementsByTagName('button')[0];
? ? ? ? b.onclick = function(){
? ? ? ? ? ? for(var arr=[],i=0;i<10;i++){
? ? ? ? ? ? ? ? arr[i] = Math.round(Math.random()*9);
? ? ? ? ? ? }
? ? ? ? ? ? document.getElementsByTagName('div')[0].innerHTML = arr.join('-');
? ? ? ? }
? ? }
</script>
</head>
<body>
? ? <button>隨機(jī)10個(gè)</button>
? ? <div></div>
</body>
</html>
查看全部 -
<!DOCTYPE html>
<html>
?<head>
? <title> 事件</title>??
? <script type="text/javascript">
? ?function count(){
? ? //獲取第一個(gè)輸入框的值
? ? var text1=document.getElementById("txt1").value;
//獲取第二個(gè)輸入框的值
var text2=document.getElementById("txt2").value;
//獲取選擇框的值
var text3=document.getElementById("select").value;
//獲取通過(guò)下拉框來(lái)選擇的值來(lái)改變加減乘除的運(yùn)算法則
var result;
switch(text3){
? ? case "+":
? ? ? result=parseFloat(text1) +parseFloat(text2);
? ? ? break;
? ? ? case "-":
? ? ? ? ? result=parseFloat(text1) -parseFloat(text2);
? ? ? break;
? ? ? case "*":
? ? ? ? ? ? result=parseFloat(text1) *parseFloat(text2);
? ? ? break;
? ? ? case "/":
? ? ? ? ? ? result=parseFloat(text1) /parseFloat(text2);
? ? ? break;
}
? ? //設(shè)置結(jié)果輸入框的值?
? ? document.getElementById("fruit").value=result;
? ? console.log(result);
? ?}
? </script>?
?</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() /> <!--通過(guò) = 按鈕來(lái)調(diào)用創(chuàng)建的函數(shù),得到結(jié)果-->?
? ?<input type='text' id='fruit' />? ?
?</body>
</html>
查看全部 -
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> 光標(biāo)聚焦事件 </title>
? <script type="text/javascript">
? ? function message(){
? ? ? ? var value=document.getElementById("ids");
? ? value.style.backgroundColor="red";
}
function message1(){
? ? var value=document.getElementById("ids");
? ? value.removeAttribute("style");
}
? </script>
</head>
<body>
請(qǐng)選擇您的職業(yè):<br>
? <form >
? ? <select name="career" onfocus="message()" onblur="message1()" id="ids">?
? ? ? <option>學(xué)生</option>?
? ? ? <option>教師</option>?
? ? ? <option>工程師</option>?
? ? ? <option>演員</option>?
? ? ? <option>會(huì)計(jì)</option>?
? ? </select>?
? </form>
</body>
</html>
查看全部 -
<!DOCTYPE? HTML>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>數(shù)組</title>
<script type="text/javascript">
?//創(chuàng)建數(shù)組
?var myArr=['*','##',"***","&&","****","##*"];
?myArr[7]="**";
?//顯示數(shù)組長(zhǎng)度
//? alert(myArr.length);
?var arrL=myArr.length;
?
//? 去掉沒(méi)有‘*’的數(shù)據(jù)
for(var i=0; i<arrL;i++){?
? ? if(myArr[i]!= undefined){
? ? ? ? var newArr=myArr[i];
? ? ? ? var newLength=newArr.length;
? ? ? ? for(var j=0;j<newLength;j++){
? ? ? ? ? ? if(newArr[j] != '*'){
? ? ? ? ? ? ? ? myArr.splice(i,1);
? ? ? ? ? ? ? ? break;
? ? ? ? ? ? }
? ? ? ? }
? ? }
}
//按照字符數(shù)排序
? ? myArr.sort(function(a, b){
? ? ? ? if(a.length>b.length){
? ? ? ? ? ? return 1
? ? ? ? }else if(a.length<b.length){
? ? ? ? ? ? return -1
? ? ? ? }else{
? ? ? ? ? ? return 0
? ? ? ? }
? ? })
// var newArr=new Array;
//? for(var z=0;z<arrL;z++){
//? ? ?if(myArr[z]!=undefined){
//? ? ? ? ?if(myArr[z].indexOf('*') != -1){
//? ? ? ? ? ? ?newArr=[...newArr,myArr[z]];
//? ? ? ? ? ? ?var newLength = newArr.length;
//? ? ? ? ? ? ?document.write(newArr,newLength+'<br/>');
//? ? ? ? ? ? ?for(var i=0;i<newLength.length;i++){
? ? ? ? ? ? ? ??
//? ? ? ? ? ? ?}
//? ? ? ? ?}
//? ? ?}
//? }
?//將數(shù)組內(nèi)容輸出,完成達(dá)到的效果。
for(var i=0;i<myArr.length;i++){
? ? if(myArr[i]!=undefined){
? ? ? ? document.write(myArr[i]+'<br/>');
? ? }
}
</script>
</head>
<body>
</body>
</html>
查看全部 -
<!DOCTYPE HTML>
<html>
? ? <head>
? ? ? ? <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
? ? ? ? <title>無(wú)標(biāo)題文檔</title>
? ? </head>
? ??
? ? <body>
? ? ? ? <form>
? ? ? ? ? 請(qǐng)選擇你愛(ài)好:<br>
? ? ? ? ? <input type="checkbox" name="hobby" id="hobby1">? 音樂(lè)
? ? ? ? ? <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>請(qǐng)輸入您要選擇愛(ài)好的序號(hào),序號(hào)為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;? ? }
? ? ? ? ? ? ? ? else{}
? ? ? ? ? ?}
? ? ? ? ? // 任務(wù)1?
? ? ? ? ? ?
? ? ? ? }
? ? ? ??
? ? ? ? function clearall(){
? ? ? ? ? ? var hobby = document.getElementsByTagName("input");??
? ? ? ? ? ?for(var i=0;i<hobby.length;i++){
? ? ? ? ? ? if(hobby[i].type=="checkbox"){
? ? ? ? ? ? ? ? hobby[i].checked=false;? ? }
? ? ? ? ? ? ? ? else{}
? ? ? ? ? ?}
? ? ? ? ? // 任務(wù)2
? ? ? ? ? ?
? ? ? ? }
? ? ? ??
? ? ? ? function checkone(){
? ? ? ? ? ? var j=parseInt(document.getElementById("wb").value);
? ? ? ? var hobby = document.getElementsByTagName("input");
? ? ? ? ? ? hobby[(j-1)].checked=true;
? ? ? ? ?// 任務(wù)3
? ? ? ??
? ? ? ? }
? ? ? ??
? ? ? ? </script>
? ? </body>
</html>
查看全部 -
<!DOCTYPE HTML>
<html>
? ? <head>
? ? ? ? <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
? ? ? ? <title>無(wú)標(biāo)題文檔</title>
? ? </head>
? ??
? ? <body>
? ? ? ? <form>
? ? ? ? ? 請(qǐng)選擇你愛(ài)好:<br>
? ? ? ? ? <input type="checkbox" name="hobby" id="hobby1">? 音樂(lè)
? ? ? ? ? <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>請(qǐng)輸入您要選擇愛(ài)好的序號(hào),序號(hào)為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(i=0;i<6;i++) {
? ? ? ? ? ? ? ?if(hobby[i].type=="checkbox"){
? ? ? ? ? ? ? ? ? ?hobby[i].checked=true;
? ? ? ? ? ? ? ?}
? ? ? ? ? ? ? ?else{}
? ? ? ? ? ?}
? ? ? ? ? // 任務(wù)1?
? ? ? ? ? ?
? ? ? ? }
? ? ? ? function clearall(){
? ? ? ? ? ? var hobby = document.getElementsByName("hobby");
? ? ? ? ? ? for(i=0;i<6;i++) {
? ? ? ? ? ? ? ?hobby[i].checked=false;
? ? ? ? ? ?}
? ? ? ? ?// 任務(wù)2? ??
? ? ? ? ? ??
? ? ? ? }
? ? ? ??
? ? ? ? function checkone(){
? ? ? ? ? ? var j=document.getElementById("wb").value;
? ? ? ? ? ? var hobby = document.getElementsByName("hobby");
? ? ? ? ? ? hobby[j-1].checked=true;
? ? ? ? ?// 任務(wù)3
? ? ? ??
? ? ? ? }
? ? ? ??
? ? ? ? </script>
? ? </body>
</html>
查看全部 -
鼠標(biāo)單擊事件 (onclick=" ");
鼠標(biāo)經(jīng)過(guò)事件 (onmouseover=" ");
鼠標(biāo)移開(kāi)事件 (onmouseout=" ");
光標(biāo)聚焦事件 (onfocus=" ");
失焦事件 (onblur=" ");
內(nèi)容選中事件 (onselect=" ");
文本框內(nèi)容改變事件 (onchange=" ");
加載事件 (onload=" ");
卸載事件 (onunload=" ").
查看全部 -
<!DOCTYPE html>
<html>
?<head>
? <title> 事件</title>??
? <script type="text/javascript">
? ?function count(){
? ? ? ?
? ? //獲取第一個(gè)輸入框的值
? ? var var1 = document.getElementById("txt1").value;
//獲取第二個(gè)輸入框的值
var var2 = document.getElementById("txt2").value;
if (var1 == '' || var1 == null) {
? ? alert('請(qǐng)輸入第一個(gè)值。');
? ? return false;
}
? ? if (var2 == '' || var2 == null) {
? ? alert('請(qǐng)輸入第二個(gè)值。');
? ? return false;
? ? }? ?
? ??
? ? var1 = parseFloat(var1);
var2 = parseFloat(var2);
//獲取選擇框的值
var sel = document.getElementById("select").value;
//獲取通過(guò)下拉框來(lái)選擇的值來(lái)改變加減乘除的運(yùn)算法則
var result;
switch (sel) {
? ? case '+':
? ? ? ? result = var1 + var2;
? ? ? ? break;
? ? ? ? case '-':
? ? ? ? result = var1 - var2;
? ? ? ? break;
? ? ? ? case '*':
? ? ? ? result = var1 * var2;
? ? ? ? break;
? ? ? ? case '/':
? ? ? ? result = var1 / var2;
? ? ? ? break;
? ? ? ? default :
? ? ? ? ? ? console.log(result);
}
? ? //設(shè)置結(jié)果輸入框的值?
? ? document.getElementById('fruit').value = result;
? ?}
? </script>?
?</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()"/> <!--通過(guò) = 按鈕來(lái)調(diào)用創(chuàng)建的函數(shù),得到結(jié)果-->?
? ?<input type='text' id='fruit' />? ?
?</body>
</html>
查看全部 -
JavaScript數(shù)組的length屬性是可變的,這一點(diǎn)需要特別注意。
查看全部 -
<!DOCTYPE? HTML>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>系好安全帶,準(zhǔn)備啟航</title>
<script type="text/javascript">
? var a=new Date();
? var day=["日","一","二","三","四","五","六"]
? var scoreStr = "小明:87;小花:81;小紅:97;小天:76;小張:74;小小:94;小西:90;小伍:76;小迪:64;小曼:76";
? var str = scoreStr.split(";");
? var score=new Array();
? var t = 0;
? for(x=0;x<10;x++){
? ? ?score[x] = (str[x].substr(3));
? ? ?t = parseInt(score[x])+t;
?}
? document.write(a.getFullYear()+"年"+(a.getMonth()+1)+"月"+a.getDate()+"日"+" "+"星期"+day[a.getDay()]+"--班級(jí)總分為:"+t/x);
</script>
</head>
<body>
</body>
</html>
查看全部 -
JS必備秘籍:https://interview.dog?source=muke
查看全部 -
<!DOCTYPE html>
<html>
?<head>
? <title> 事件</title>??
? <script type="text/javascript">
? ?function count(){
? ? var a = document.getElementById("txt1").value;
? ? //獲取第一個(gè)輸入框的值
? ? var b = document.getElementById("txt2").value;
//獲取第二個(gè)輸入框的值
var c = document.getElementById("select").value;
var d;
//獲取選擇框的值
? ? switch (c){
? ? ? ? case "+":
? ? ? ? ? ? document.getElementById("fruit").value = parseInt(a)+parseInt(b);
? ? ? ? ? ? break;
? ? ? ? case "-":
? ? ? ? ? ? document.getElementById("fruit").value = parseInt(a)-parseInt(b);
? ? ? ? ? ? break;
? ? ? ? case "*":
? ? ? ? ? ? document.getElementById("fruit").value = parseInt(a)*parseInt(b);
? ? ? ? ? ? break;
? ? ? ? case "/":
? ? ? ? ? ? document.getElementById("fruit").value = parseInt(a)/parseInt(b);
? ? ? ? ? ? break;
? ? }
//獲取通過(guò)下拉框來(lái)選擇的值來(lái)改變加減乘除的運(yùn)算法則
? ? //設(shè)置結(jié)果輸入框的值?
? ??
? ?}
? </script>?
?</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()'/> <!--通過(guò) = 按鈕來(lái)調(diào)用創(chuàng)建的函數(shù),得到結(jié)果-->?
? ?<input type='text' id='fruit' />? ?
?</body>
</html>
查看全部
舉報(bào)