js基本知识2

一、提示框1. 弹出警示框 ??alert(); ?????window.alert(); ??window 窗口 ??2. 控制台输出 ??console.log() 3. 文档打印 ???document ?文档 ????document.write();1.下面哪种JavaScript语法格式是正确的（ ）A．echo "I enjoy JavaScript"; ????????????????????????????B．document.write( I enjoy JavaScript)C．response.write("I enjoy JavaScript ") ???; ??D．alert("I enjoy JavaScript "); ?二、 变量 ?Java ??Var ?aa:int = 10;Var ?num ?= ?10;字母 ?_ ??$ ?开头 ?Var dd=100,ee=100 ?声明多个变量 ?逗号隔开1.Javascript中, 以下声明变量语句中哪个不正确？ ?A、var aa; ??B、var bb=3; cc=‘good‘; ?C、var dd = ee = 100; ?D、var ff=3, gg=‘he‘s good‘; ?三、 事件三要素 ??????事件源 ????被触发的对象 ???名词 ???????事件 ??????动词 ???onclick ?onmouseover ???onmouseout ??????事件处理程序 ?放到函数里面就行了 ?事件源.事件 = function(){ 语句; } ?????入口函数: window.onload = function(){ ??} ???四、 ?????行内式 ???????<div ?onclick=”alert(11)”> ?????内嵌式 ???????外链式 ???????<script type=”text/javascript” src=”xx.js”></script>五、数据类型 ???????Number ??string ??boolean ???null ?undefined 1.2 ???函数(function)函数： 函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。四大发明 ???造纸术 ?火药 ?指南针 ?印刷术 1.2.1 ???函数的声明 ?函数使用跟变量一样，需要 声明1.2.2 ???自定义函数 function fun(){ ???alert("我是自定义函数")}fun(); ?// 函数不调用，自己不执行1.2.3 ???函数直接量声明var fun1 = function(){ ???alert("直接量声明")}fun1(); ?也需要调用1.2.4 ???利用Function 关键字声明var fun2 = new Function("var a = 10; var b = 20; alert(a+b)");fun2();1.2.5 ???变量声明提升什么是变量提升1 ??function fun(){2 ?????????console.log(num);3 ?????????var num = 20;4 ?}相当于 ---5 ?function fun(){6 ?????????var num;7 ?????????console.log(num);8 ?????????Num = 20;9 ?}在函数体内部，声明变量，会把该声明提升到函数体的最顶端。 只提升变量声明，不赋值。var a = 18;f1();function f1(){ ???var b=9; ???console.log(a); ???console.log(b); ???var a = ‘123‘;}结果是： undefined ?9 ?1.2.6 ???函数参数 ?arguments是存储了函数传送过过来实参 Javascript在创建函数的同时，会在函数内部创建一个arguments对象实例.arguments对象只有函数开始时才可用。函数的 arguments 对象并不是一个数组，访问单个参数的方式与访问数组元素的方式相同arguments对象的长度是由实参个数而不是形参个数决定的 ???<script> ???function fn(a,b) ???{ ???????console.log(fn.length); //得到是 函数的形参的个数 ???????//console.log(arguments); ???????console.log(arguments.length); // 得到的是实参的个数 ???????if(fn.length == arguments.length) ???????{ ???????????console.log(a+b); ???????} ???????else ???????{ ???????????console.error("对不起，您的参数不匹配，正确的参数个数为:" + fn.length); ???????} ???????//console.log(a+b); ???} ???fn(1,2); ???fn(1,2,3);</script> ?Var a = 10, b = 20; ?等价的 ?Var a = 10; ?Var b = 20;1.3 ?????案例 鼠标展示代码：var box = document.getElementById("box");function fn(liid,bg){ ?// 封装函数 ?参数的传递 ???var obj = document.getElementById(liid); ???obj.onmouseover = function(){ ???????box.style.backgroundImage = bg; ???}}fn("li01","url(images/01big.jpg)"); // 实参fn("li02","url(images/02big.jpg)");fn("li03","url(images/03big.jpg)");fn("li04","url(images/04big.jpg)");fn("li05","url(images/05big.jpg)");1.4 ???返回值 ?return 定义：一个函数实际上就是一个计算过程，计算完成之后的结果就是返回值。定义函数的返回值：在函数内部用return来设置返回值，一个函数只能有一个返回值。同时，终止代码的执行。所有的自定义函数默认没有返回值；Return 后面不要换行function $(id){ return document.getElementById(id);}$("demo").style.backgroundColor = ‘purple‘;$("test").style.backgroundColor = "blue";1.以下代码执行的结果是多少？请分析为什么？1 ??var total=10;1 ?????var number = square(5);2 ?????alert(number);3 ?????function square(n) {4 ?????????total = n*n;5 ?????????return total;6 ?} 结果是 251.5 ???算术运算符 + ?- ??* ??/ ????% ????^ ????1+1 = 2 ???5%2 == ?1 ???2%5 ?== ?2 ????2^3 ????A++ ?++后置 ??????每次自加1 ????先运算后自加 ++a ??++前置 ??????每次自加1 ???先自加 后运算 1.分析代码，得出正确的结果。1 ?????var a=10, b=20 , c=30;2 ?????++a;3 ?????a++;4 ?????e=++a+(++b)+(c++)+a++;5 ?????alert(e);771.6 ???条件语句(if) ?If(条件表达式) ?{ 语句;} ?If() {}else {} If() ?else if(){} ?else if(){} else {}1.7 ???获得焦点 ?失去焦点 事件 ??我们前面学过了 ?onclick ?点击 ?onmouseover ?onmouseout’ 获得焦点: ??onfocus ????????fao ~克死 失去焦点: ??onblur ?????????不len ~~ ?<script> ???window.onload = function(){ ???????var txt = document.getElementById("txt"); ???????txt.onfocus = function(){ //得到焦点 ???????????//alert("得到了焦点"); ???????????//什么时候该清空呢 ???????????//用户没有输入的时候，用户第一次使用的时候 ??????????// 如果 这里input 里面的文字 是 请输入... ?说明用户没有用过，就应该清空 ???????????if(txt.value == "请输入...") ???????????{ ???????????????txt.value = ""; ???????????????txt.style.color = "#333"; ???????????} ???????} ???????txt.onblur = function(){ //失去焦点 ???????????//alert("失去了焦点"); ???????????//什么时候再还原呢？ ???????????//input的值是 空的时候，我们再复原 ???????????if(txt.value == "") ???????????{ ???????????????txt.value = "请输入..."; ???????????????txt.style.color = "#ccc"; ???????????} ???????} ???}</script>1.8 ???this (自己的)指的是本身This 主要是指事件的调用者 。 className ???类名 $("result").className ="wrong";innerHTML ??更换 盒子里面的内容 ???文字 标签都换.表单更换内容 Input.value isNaN ???nan 不是一个数字 ???is 是 ??是 不是一个数字isNaN(“12”) ??如果里面的不是个数字 返回 true ??否则返回false1.9 ???属性和方法手机 ??????黑色的 ????5.5寸的 ?????塑料的 ?????铁的 ??外在特性 ?????属性 ?手机的颜色是黑色的。Iphone.color = “red”; ????属性给值一定是等号 ??方法： ?手机 打电话 ??发短信 ?玩游戏 ??聊QQ ?看电影 ??动词 ??可以干什么 ??Iphone.tel(); ????方法和属性的区别： ?方法一律带有小括号 。 ?isNaN( ); ???动词 ??方法给值： ???isNaN（“值”）;1.9.1 ???表单自动获得焦点 Txt.focus(); ??方法 ??Onfocus ?事件 ?<!DOCTYPE html><html><head lang="en"> ???<meta charset="UTF-8"> ???<title></title> ???<script> ???????window.onload = function(){ ???????????var txt = document.getElementById("txt"); ???????????txt.focus(); //自动获得焦点 ???????} ???</script></head><body>自动获得焦点:<input type="text" id="txt"/></body></html>1.9.2 ???鼠标经过选择表单 sele.onmouseover = function(){ ???this.select(); //选择}方法 ?select() ?选择功能 1.10 ???For 循环人生一个循环i+=3 ???????i=i+3 ?1.11 ???getElementsByTagName() ?获取某类标签前面我们可以得到一个盒子 ?通过 ?id 获得 getElementById() ??只得到一个 盒子我们想要获取某类标签 ??比如说所有 的div ??li ?spangetElementsByTagName(); ?很多个所以是复数 ??很多个得到的是一个伪数组。Lis ?数组 ?Lis[索引号] ??一个 ?