JavaScript基础

xiaoxiao2021-02-27  291

JavaScript基础

弹出消息框 alert实例: var a=8;//定义变量 alert("hello world"+a);//字符串+变量 消息对话框confirm实例: function rec(){ //定义一个函数 var mymessage=confirm("你喜欢javascript"); if(mymessage==true) //如果返回值为真 { document.write("是的!"); } else { document.write("不是!"); } } <body> <input name="button" type="button" onClick="rec()" value="点击我,弹出确认对话框" /> //在body中设置一个button,当button被点击调用rec()函数 </body> 消息对话框prompt实例: function rec(){ var score; //score变量,用来存储用户输入的成绩值。 score = prompt();//把消息框的值赋值给变量score if(score>=90) // 做if判断 { document.write("你很棒!"); } else if(score>=75) { document.write("不错啊!"); } else if(score>=60) { document.write("要加油!"); } else { document.write("要努力了!"); } } <body> <input name="button" type="button" onClick="rec()" value="点击我,对成绩做评价!" /> //button调用rec()函数 </body> 打开新窗口 Window.open实例:语法:window.open([URL], [窗口名称], [参数字符串]) function myopen{ window.open('http://www.baidu.com','_black','width=300,height=200,menubar=no,toolabr=no,status=no,scrollbar=yes') } <body> <input type="button" name="button" onClick="myopen" value="点我打开新窗口"> </body> 各个参数

关闭窗口 Window.close语法:window.close();或object.close();实例: var mywin=window.open("http://www.baidu.com"); var a=confirm("是否关闭窗口"); if(a==ture){ mywin.close(); }

初识DOM

获取元素语法 document.getElementById(标签值);实例: <p id="con">JavaScript</p> <script type="text/javascript"> var mychar= document.getElementById("con") ; document.write("结果:"+mychar); //输出获取的P标签。 </script> innerHTML属性语法 object.innnerHTML <h2 id="con">JavaScript</h2> <script type="text/javascript"> var mychar=document.getElementById("con"); document.write("原标题:"+mychar.innerHTML+"<br>"); mycahr.innerHTML="hello world"; document.write("现标题:"+mychar.innerHTML+"<br>") </script> 改变HTML样式语法:object.style.property=new style; (property 属性) <h2 id="con">I love JavaScript</H2> <p> JavaScript使网页显示动态效果并实现与用户交互功能。</p> <script type="text/javascript"> var mychar= document.getElementById("con"); mychar.style.color="red"; mychar.style.backgroundColor="#ccc"; mychar.style.width="300px"; </script> 显示和隐藏语法:object.style.display=value function hidetext(){ var mychar=document.getElementById("con");//取得p标签的id mychar.style.display="none"; //隐藏 } function showtext(){ var mychar=document.getElementById("con"); mychar.style.display="block"; //显示 } <body> <p id="con">快来隐藏我!</p> <input type="button" name="button" value="隐藏" onclick="hidetext()"> <input type="button" name="button" value="显示" onclik="showtext()"> </body> 控制类名 className();语法:object.className=classname <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> //css样式 body{font-size: 10px;} .one{ border: 1px solid #eee; width: 200px; height: 50px; background: #ccc; color: red; } .two{ border: 1px solid #ccc; width: 200px; height:50px; background: #9cf; color: blue; } </style> </head> <body> <p id="p1">javascript</p> <input type="button" name="button" onclick="add()" value="添加样式"> <p id="p2">javascript</p> <input type="button" name="button" value="改变外观" onclick="modify()"> <script type="text/javascript"> function add(){ var p1=document.getElementById("p1");//获取p1的id p1.className="one"; //把p1的样式改为one } function modify(){ var p2=document.getElementById("p2");//获取p2的id p2.className="two"; //把p2的样式改为two } </script> </body> </html> 逻辑与操作符 &&用法: if(条件1 && 条件2)//条件1和条件2同时满足的情况下运行代码。 { 运行代码 } 逻辑或操作符 ||用法: 有真则真,全假才假。 逻辑非操作符 !用法: var a=3; var b=5; var c; c=!(b>a); // b>a值是true,! (b>a)值是false c=!(b<a); // b<a值是false, ! (b<a)值是true 一维数组创建方法: var myarr=new Array();//创建数组

数组赋值

第一种方法 var myarray = new Array(66,80,90,77,59);//创建数组同时赋值 第二种方法 var myarray = [66,80,90,77,59];//直接输入一个数组(称 “字面量数组”) 数组添加成员 myarray[6]=88; (注意数组下标为0)

数组长度:

var myarray=[10,55,66,88]; document.write("数组长度"+myarray.length); 二维数组创建数组:

方法1:

var myarr=new Array(); //先声明一维 for(var i=0;i<2;i++){ //一维长度为2 myarr[i]=new Array(); //再声明二维 for(var j=0;j<3;j++){ //二维长度为3 myarr[i][j]=i+j; // 赋值,每个数组元素的值为i+j } }

方法2:

var Myarr = [[0 , 1 , 2 ],[1 , 2 , 3]];
转载请注明原文地址: https://www.6miu.com/read-3405.html

最新回复(0)