速成笔记:Javascript

JS初步及调试

1.Javascript是一种描述式语言,与html结合,用于增强功能

2.由NetScape公司利用sun的java开发。但与java完全不同的语言,与java类似的结构和语法,但为函数式语言。

3.客户端的JavaScript必须有浏览器的支持

4.JavaScript(ECMAScript):

基础语法、DOM(Document Object Model)、BOM(Brower Object Model)

5.常见的函数

alert(“字符串”);   //弹出模态窗口

document.write(“字符串”);       //典型的DOM语句

6. 在网页里加入JS:

js可以出现在html里的任意位置:一般函数定义出现在head里边,真正的操作语句出现在body里边

第①种方式:

<Script type = “text/javascript”>

       alert(“hello,javascript!”);

</Script>

第②种方式:

<Script language = “javascript” src = “2.js”></Script>

在2.js中: alert(“hello,javascript!”);

7.一个页面可以有若干个<Script>…</Script>不同部分的方法和变量可以共享

js的变量为弱类型,所有的变量定义均以var来实现,区分大小系

var 变量名;     //定义变量类型(建议) 也可以不定义,直接使用变量名(不建议)

变量名=…;       //可以用 “字符串”      来赋值变量

例如:

<Script language = “javascript”>

       var greeting;

greeting = “welcome to the js!”;

</Script>

       …

<Script language = “javascript”>

       document.write(greeting);

</Script>

8. 最朴素的两种调试方法:打印alert和删一段改一段

js难点在于调试:浏览器没法报错

ie浏览器-工具-internet选项-高级-取消”禁用脚本调试” 选中”显示每个脚本错误的通知”

报错弹出的窗口选择”显示详细信息”

在jsp中报错为动态页面转为静态页面的行号

JS基本语法

1.数组定义:

var arr = new Array(3);  //可以定义数组长度,但是基本没用,因为超过长度仍然可以使用

arr[0]=1; arr[1]=2; arr[2]=3; arr[3]=4;

或   var arr = new Array(2,3,4,5);

js内部数组的样子:new出来属性名和属性值 相当于面向对象的成员变量

数组下标数字作为名字,数组元素值作为值

2.算术运算、逻辑运算、(与java相同的”+”)字符串连接、条件操作((…)?(…):(…))、while循环、

if-else分支、switch-case语句、for循环、do-while循环

//求字符串greeting的(从第0个开始数的)第3个字符开始一共截取9个字符的子集

greeting.substring(3,9); 

//字符串长度的操作   在第3个位置上的字符(从第0个开始数的)

str.length               str.charAt(3);

//获取当前时间

var today = new Date();

var hour = today.getHours(); //获取当前小时

函数 事件处理

1.在<Script>内部定义函数:

function 函数名(参数列表){

       函数体;

}

2.在其他<Script>中可以调用该函数;

3.在函数体中可以有return语句,不必再function后面加上返回值类型(弱类型);

4.js事件处理:当网页上发生某些事件的时候会调用某些函数

onFocus:得到焦点的事件(用户为了输入而选择select、text、password、textarea等时)

<form name=“text”>

<input type=“text” name=“userName” value=“myname” οnfοcus=“javascript:alert(document.text.userName.value);”>

</form>

失去焦点的事件onBlur 值被改变且失去焦点的事件onChange

5.其他js事件处理

onClick:在button、checkbox、radio、link、reset、submit、text、textarea等对象被鼠标点中时

<img src=“my.jpg” onClick=“alert(‘ok’);”></img>

注意”javascript:alert(‘ok’);”//由于外边使用双引号 所以alert内部只能用单引号

onLoad出现在一个文档载入到一个窗口时

onUnload当用户退出一个文档时

<body onLoad=“javascript:alert(‘hello’);” onUnload=“javascript:alert(‘bye-bye’);”>

onMouseOver鼠标被移动到一个对象上是

onMouseOut鼠标从一个对象上移开时

onSelect当form对象中的内容被选中是

onsubmit出现在用户通过提交按钮提交一个表单时可以进行表单的验证

<Script type=“text/javascript”>

       function check(){

       if(document.test.t.value == ““){

              alert(“空串不允许”);

              return false;

}

       return ture;

}

</script>

<form name=“test” action=“1.html” onSubmit=“return check()”>

       <input type=“text” name=“t”>

       <input type=“submit” name=“ok”>

</form>

内置对象_DOM_BOM

1.js的对话框

警告框:alert出现一个提示信息

询问框:prompt返回输入的值(很少使用)

var Name = prompt(“请输入你的名字:”);

document.write(“你好!”+Name);

确认框:confirm根据不同的选择返回true/false

2.js的内置对象

①this指的是当前的标签对象

②for…in后缀一个对象,此对象中的所有元素循环一次

for( i in arr)    … arr(i)    i是arr的下标也是arr成员变量的属性名字

③with为一段代码建立一个缺省的对象,任何无对象的属性引用,都将使用该缺省的对象

       with(document){

              write(“…”);

              write(“…”);

              write(“…”);

}

④new用于生成一个新的对象

3.BOM窗口中的对象和元素

window

n   window.status=”hello,please look here”//状态栏

n   window.open(“1.html”,”newWin”,”toolbar=no,left=200,top=100,menubar=no,

width=100,height=100,resizable=no”);      //弹出新窗口(少用:浏览器拦截弹出窗口)

n   var aHandle=window.open(...);     //保存返回的句柄或钩子

n   aHandle.close();

location:windows.location//地址栏里的内容或者 document.location 或者赋值转向某URL

history:history.back();

document

其他

1.产生动画常用的函数

setTimeOut(“show()”,80);          //80ms后执行递归调用show()函数

setInterval

2. 表单验证:在onSubmit中调用check()函数 check()函数利用alert弹出窗口

var re=/^[0-9a-z][\w-.]* [0-9a-z]$/i

re.test(ssn)  //利用正则表达式re验证ssn

 

form.xxx.focus() //xxx为form中的某个input的name 将输入焦点定位到错误的输入框

 

if(str.charCodeAt[i]>255) len+=2;else len++; //对于中文字符等其他字符占2个字节大小

3.表单验证v2.0:

<input           ...           onBlur=”check()”>

<div id=“userNameErr”></div>

 

在check()函数内部替换alert的方法:

document.getElementById(“userNameErr”).innerHTML=”<font color=’red’>请输入正确的用户名</font>”  //在div之间动态指定样式(另起一行)也可以用span(不会另起一行)

document.getElementById(“userNameErr”).innerHTML=”” //当输入正确时候

4.后台框架

5.tree

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值