- 浏览: 122749 次
- 性别:
- 来自: 佛山
文章分类
最新评论
-
zgw06629:
多谢提供的安装包
MyEclipse安装资源文件支持中文插件编辑属性 -
lmzpp:
学习了,谢谢
MyEclipse安装资源文件支持中文插件编辑属性 -
nba:
不错, 谢谢了
MyEclipse安装资源文件支持中文插件编辑属性 -
CMShmily:
MyEclipse安装资源文件支持中文插件编辑属性
[color=indigo][/color]js(javascript)常用函数代码2010年10月31日 22:50++++++++++++++++++++++++++++++++++++++
结构
<script language="JavaScript" type="text/javascript" src="">
<!-- hide this stuff from other browsers
// end the hiding comment -->
</script>
++++++++++++++++++++++++++++++++++++++
变量
var a,b= 60;
局部变量
function f(){
var a=1;
}
全局变量
var n=5;
function f(){
}
++++++++++++++++++++++++++++++++++++++
数据类型
获取变量的数据类型
typeof(变量名或常量);
++++++++++++++++++++++++++++++++++++++
语句结构
语句的结尾有分号(;)作为终止符号。
++++++++++++++++++++++++++++++++++++++
运算符
逗号:,
赋值:=
字符串连接操作符:+
加:+
减:-
乘:*
除:/
取余:%
递增:++
递减:--
+=,-=,*=,/=,%=
等于:==
不等于:!=
大于:>
小于:<
大于等于:>=
小于等于:<=
恒等于:===
与:&&
或:||
非:!
++++++++++++++++++++++++++++++++++++++
注释
//
/**/
++++++++++++++++++++++++++++++++++++++
流程控制
expression?expression1:expression2
----------
if(){
}
else{
}
----------
switch(){
case C1:
..
break;
case C2:
..
break;
default:
..
}
----------
while(){
}
----------
do{
}while()
----------
for(;;){}
----------
break;
continue;
----------
++++++++++++++++++++++++++++++++++++++
函数
function 函数名(){}
值传递
var s=1;
func(s);
引用传递
var obj=new object();
func(obj);
返回值
return
深入认识函数
function func1(...){...}
var func2=function(...){...}
var func3=function func4(...){...}
var func5=new Function();
function myf(a,b){
return a+b;
}
等价于
var myf=new Function("a","b","return a+b");
下面的定义是等价的
new Function("a","b","c","return a+b+c")
new Function("a,b","c","return a+b+c")
new Function("a,b,c","return a+b+c")
直接在函数声明后面加上括号就表示创建完成后立即进行函数调用
var i=function (a,b){
return a+b;
}(1,2);
alert(i);
将函数作为参数传递
function func1(thefunc){
thefunc();
}
function func2(){
alert("hi");
}
func1(func2);
隐含参数:arguments
function func(a,b){
alert(a);
alert(b);
for(var i=0;i<arguments.length;i++){
alert(arguments[i]);
}
}
//1 2 1 2 3
用this指针来获得该对象自身的引用
++++++++++++++++++++++++++++++++++++++
内部函数
eval()
parseInt()字符串转整数
parseFloat()字符串转浮点数
escape()将字符串编码为url形式
unescape()解码escape()编码的字符串
isNaN()判断是否是数字
isFinite()判断是否是数字
++++++++++++++++++++++++++++++++++++++
对象
Date对象
Date对象用来处理日期和时间
var objDate=new Date();
objDate.getFullYear()//返回年
objDate.getMonth()//返回月
objDate.getDate()//返回日
objDate.getDay()//返回星期
objDate.getHours()//返回小时
objDate.getMinutes()//返回分
objDate.getSeconds()//返回秒
objDate.getTime()//返回GMT时间,1970.1.1起经过的毫秒数
++++++++++++++++++++++++++++++++++++++
Math对象
Math对象用来进行数据运算
四舍五入 Math.round(x)
x=Math.round(x);
随机函数 Math.random()
返回一个0到1之间的小数。
Math.round(Math.random()*随机整数数目)+整数范围的下限
返回100-200的随机整数
Math.round(Math.random()*100)+100
++++++++++++++++++++++++++++++++++++++
Array对象
数组对象
创建数组
var objArray=new Array();//创建一个空数组
var objArray=new Array(10);//创建一个数组,包括10个元素
var objArray=new Array("a","b","c");//以"a","b","c"3个元素初始化一个数组对象
赋初值:
Myarray[1]=“字串1”;
访问数组元素
a=Myarray[0];
内部数组
anchors[]:使用<a name="anchorName">标识来建立锚的链接。
links[]: 使用<a href="URL">来定义一个越文本链接项。
Forms[]: 在程序中使用多窗体时,建立该数组。
Elements[]:在一个窗口中使用从个元素时,建立该数组。
Frames[]:建立框架时,使用该数组
多维数组
定义
var arr=new array(4);
for(var i=0;i<4;i++){
arr[i]=new Array(6);
}
访问
for(var i=0;i<4;i++){
for(var j=0;j<6;j++){
//处理arr[i][j]
}
}
属性
数组长度:objArray.length;
方法
转为字符串:objArray.toString()
以sep指定的字符作为分隔符,将数组转为字符串:objArray.join(sep)
弹出数组最后一个元素:objArray.pop()
将参数加到数组结尾:objArray.push(value)
++++++++++++++++++++++++++++++++++++++
String对象
字符串
属性
字符串长度:str.length;
方法
返回ascii字符:string.charCodeAt();//"abc".charCodeAt(0)返回97
返回长度为length的子字符串:string.substr(start,length);
返回start到end的子字符串string.substring(start,end);
以s作为分隔符切割成多个子字符串:string.split(s);
替换和匹配字符串
搜索出匹配正则的所有子字符串:match(regExp)
字符串中搜索出匹配正则的第一个子字符串:search(regExp)
++++++++++++++++++++++++++++++++++++++
navigator对象
获取浏览器信息
属性
浏览器的正式名称:appName
是否启用了cookie:cookieEnabled
操作平台:platform
浏览器及环境信息:userAgent
var i=navigator.userAgent.toLowerCase().indexOf("firefox");
++++++++++++++++++++++++++++++++++++++
location对象
处理地址栏信息
window.location.href="http://www.163.com";
<a href="javascript:void(0)" onclick="">page</a>
javascript:void(0)使<a>不起作用
++++++++++++++++++++++++++++++++++++++
history对象
历史记录
history.back();//单击[后退]按钮
history.forward();//单击[前进]按钮
history.go(-2);//单击两次[后退]按钮
++++++++++++++++++++++++++++++++++++++
document对象
文档操作
document.write("");//向页面写入数据
document.writeln("")
document.bgColor='white';//改变背景颜色
属性
返回所有表单组成的数组:forms
返回所有图像组成的数组:images
++++++++++++++++++++++++++++++++++++++
window对象
浏览器窗口
新建窗口
window.open(url,windowName,"name1=value1,...");
关闭窗口
window.close();
延时执行一次
setTimeout("function",time);
隔固定时间执行
setInterval("function",time);
属性
状态栏显示的文本:status
默认状态栏信息:defaultStatus
window.status="mesage";
window.defaultStatus="message";
alert("message");//输出
prompt(message,defaultValue);//输入
confirm("message");//[确认][取消]返回true,false
++++++++++++++++++++++++++++++++++++++
事件
onMouseDown onMouseMove onMouseOut onMouseOver onMouseUp
onFocus onBlur onChange onSelect
onKeyDown onKeyPress onKeyUp
onClick onDblClick
function statusreport() {
var tempx = event.clientX + document.body.scrollLeft;
var tempy = event.clientY + document.body.scrollTop;
status='在整个页面中的X, Y坐标 : ('+tempx+', '+tempy+') ; 在当前窗口中的X, Y坐标 : ( '+event.clientX+', '+event.clientY +')';
}
<body onmousemove="statusreport();">
event对象属性
窗口的x坐标:clientX
窗口的y坐标:clientY
屏幕的x坐标:screenX
屏幕的y坐标:screenY
鼠标按键:button
键盘按键:keyCode
按下shift键:shiftKey
按下alt键:altKey
按下ctrl键:ctrlKey
1)
<script language="javascript" type="text/javascript">
<!--
function asy(){
alert("hello");
}
document.onclick=say;
-->
</script>
2)
<textarea id="" name="content"></textarea>
<script language="javascript" type="text/javascript">
<!--
var txt=document.getElementById("content");
txt.onkeydown=function(evt){
evt=evt?evt:window.event;//兼容浏览器
if(evt.ctrlKey &&13==evt.keyCode)thie.form.submit();
}
-->
</script>
++++++++++++++++++++++++++++++++++++++
表单
获得表单
var myform=document.forms["myform"];
Form对象事件
onsubmit在表单提交之前触发
onreset在表单被重置之前触发
引用表单元素
var element=theForm.elements[idex];
var element=theForm.elements[elementName];
遍历一个表单中的所有表单域
for(var i=0;i<theForm.elements.length;i++){
if("checkbox"==theForm.elements[i].type){}
}
表单域的通用属性
1)创建只读(不可用)表单域
element.disabled=true;
element.disabled=false;
2)获取表单域的值
value
表单域的通用方法
表单域获得焦点:focus()
表单域失去焦点:blur()
表单域的通用事件
onFocus:获得焦点时,产生该事件
OnBlur:失去焦点时,产生该事件
--Onselect:文字被加亮显示后(选择),产生该文件。
onchange:表单域的值改变时
onclick:键盘单击
onkeydown:键盘按下
onkeyup:键盘松开
onkeypress:键盘按下松开
onmouseover:鼠标移上
onmouseout:鼠标移出
onmousedown:鼠标按下
onmouseup:鼠标松开
文本域
获取和设置文本域的内容:value
var a=document.the_form.the_text.value;
获得HTML标记中的value值:defaultValue
选中文本:select
<input type="text" name="" onfocus="this.select()">
复选框
当复选框被选中时checked返回true
document.forms[0].elements[i].checked
<script language="javascript">
function get(){
var a=document.getElementsByName("ck");
var b=a.length;
alert(b);
for(var i=0;i<b;i++){
if(a[i].checked){
alert(a[i].value);
}
}
}
</script>
<input type="checkbox" name="ck" value="10">
<input type="checkbox" name="ck" value="20">
<input type="checkbox" name="ck" value="30">
<input type="button" onclick="get()" value="get ck box">
--------------------
var is_checked=document.the_form.the_checkbox.checked;
if (is_checked == true){
alert("Yup, it's checked!");
}
else{
alert("Nope, it's not checked.");
}
单选按钮
checked属性来获取或设置单选按钮的状态
var is_checked=document.form_1.radio_2.checked;
下拉列表框
使用value属性获取和设置下拉列表框的值
使用length属性获取选项个数
使用selectedIndex属性获取当前选项的索引
使用options属性获取选项集合
option对象的selected属性:选中和未选中
select对象的onchange事件:选中项发生变化时
改变该下列选单中<option>标记中所指定的值
window.document.form_1.pulldown_1.options[1].value = 'new_text';
改变该下列选单中的第2个选项值
window.document.form_1.pulldown_1.options[1].text = 'new_text';
选择一个选项,selectedIndex属性将变成被选项的数组索引号
document.form_1.select_1.selectedIndex = 1;
添加一个选项
document.form_1.select_1.options[slt.length]=new Option("value3","text3");
删除一个选项
document.form_1.select_1.options[0]=null;
清空select对象
document.form_1.select_1.length=0;
替换一个选项
document.form_1.select_1.options[1]=new Option("apple","apple");
表单验证
1)<input type="submit" onclick="return validade()">
2)<form action=""method="" onsubmit="return validate()">
验证文本中否为空:
if(tbusername.value.length==0){
alert("");
return false;
}
验证下拉列表是否为空:
if(sltcity.selectIndex==0){
alert("");
return false;
}
++++++++++++++++++++++++++++++++++++++
类
javascript中,函数和类是一个概念
当对一个函数进行new操作就返回一个对象
function class1(){//定义类
//类成员的定义及构造函数
}
var obj=new class1();
动态添加属性
var user=new object();
user.name="aaa";//添加属性
动态添加方法
user.fun=function(){//添加方法
//代码
}
user.fun();//调用fun方法
动态修改属性和方法
user.name="mm";
user.fun=function(){
}
属性删除属性和方法
user.name=undefined;
user.fun=undefined;
使用{}创建无类型对象
属性名和内容之间用冒号(:)隔开
除最后一个属性(方法)定义,其他的必须以逗号(,)结尾
var obj={};//定义一个空对象
var user={
name:"mm",//定义name属性为mm
acolor:["red","green"],//定义数组
fc:function(){//定义方法
alert("hi");
}
}
prototype原型对象
表示了一个类的成员集合
//定义一个空类
function class1(){
}
//对类的prototype对象修改,增加方法method
class1.prototype.method=function(){
alert("aa");
}
var obj1=new class1();//创建实例
obj1.method();//调用方法
++++++++++++++++++++++++++++++++++++++
类的继承
1)通过拷贝一个类的prototype到另外一个类来实现继续
function class1(){}
function class2(){}
class2.prototype=class1.prototype;
class2.prototype.mor="xx";
class2.prototype.fun=function(){}
var obj=new class2();
++++++++++++++++++++++++++++++++++++++
框架
每个框架都对应一个html页面
框架间互相引用(frames)
window.frames["frameName"];
window.frames.frameName
window.frames[index]
其中window可以用self代替或省略
子框架引用父框架(parent)
改变框架的载入页面(location)
window.frames[0].location="1.html"
引用其他框架内的javascript变量和函数
例:
<frameset cols="20%,80%">
<frame src="link.html" name="link">
<frame src="show.html" name="show">
</frameset>
show.html
<a href="void(0)" onclick="self.parent.link.add(12345)">加入购物车</a>
link.html
var arr=new Array();
function add(id){
arr.push(id);
}
++++++++++++++++++++++++++++++++++++++
cookie
设置cookie
document.cookie="userId=828";
document.cookie="userId=828;userName=hulk";
document.cookie="str="+escape("I love js");
值中有特殊符号时用escape()进行编码
用escape()进行编码的值需用unescape()进行编码后
才能得原来的值
获取cookie值
var strcookie=document.cookie;
var strCookie=document.cookie;
var arrCookie=strCookie.split(";");//分多个cookie
for(var i=0;i<arrCookie.length;i++){
var arr=arrCookie[i].split("=");//分cookie的名和值
}
给cookie设置终止日期(expire)
var date=new Date();
...
document.cookie="id=828; expire="date.toGTMstring();
删除cookie
var date=new Date();
date.setTime(date.getTime-10000);//将date设置为过期时间
document.cookie="id=828; expire="+date.toGTMstring();
++++++++++++++++++++++++++++++++++++++
异常处理
1)try-catch-finally
try{
//要执行的代码
}
catch(e){
//处理异常的代码
}
finally{
无论异常发生与否都会执行的代码
}
2)用throw语句抛出异常
if(){
throw new Error("error");
}
++++++++++++++++++++++++++++++++++++++
DOM
直接引用结点
document.getElementById()
<span id="s1"></span>
var span1=document.getElementById(s1);
span1.innerHTML="hi";
引用指定标记名称的结点
document.getElementsByTagName()
<sapn id="s1"></span>
<sapn id="s2"></span>
var arrspan=document.getElementByTagName("span");
for(var i=0;i<arrspan.length;i++){
arrspan[i].innerHTML="hi";
}
++++++++++++++++++++++++++++++++++++++
Ajax
创建
处理
open
头(缓存)
send
GET
<script language="javascript">
function InitAjax(){
var ajax=false;
try {
ajax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajax = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
ajax = false;
}
}
if (!ajax && typeof XMLHttpRequest!='undefined') {
ajax = new XMLHttpRequest();
}
return ajax;
}
function getNews(newsID){
if (typeof(newsID) == 'undefined'){
return false;
}
var url = "http://127.0.0.1/ajax/get/ajax_get.php?id="+ newsID;
var show = document.getElementById("show_news");
var ajax = InitAjax();
ajax.open("GET", url, true);
ajax.onreadystatechange = function() {
if (ajax.readyState == 4 && ajax.status == 200) {
show.innerHTML = ajax.responseText;
//alert(ajax.responseText);
}
}
ajax.send(null);
}
</script>
POST
<script language="javascript">
var ajaxObj = null;
function getXmlHttp(){
var xmlObj = null;
if(window.XMLHttpRequest)
{
xmlObj = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
xmlObj = new ActiveXObject("Microsoft.XMLHTTP");
}
else
{
xmlObj = new XMLHttpRequest();
}
return xmlObj;
}
function updateDiv()
{
ajaxObj = getXmlHttp();
ajaxObj.onreadystatechange = onStateChange;
ajaxObj.open("GET", "http://127.0.0.1/ajax/json.php", true);
ajaxObj.setRequestHeader('If-Modified-Since', '0');
ajaxObj.send(null);
}
function onStateChange()
{
if(ajaxObj.readyState == 4 && ajaxObj.status == 200)
{
var json = eval('(' + ajaxObj.responseText + ')');
document.getElementById("test").innerHTML = json.t2;
}
}
</script>
JSON
<script language="javascript">
function InitAjax()
{
var ajax=false;
try {
ajax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajax = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
ajax = false;
}
}
if (!ajax && typeof XMLHttpRequest!='undefined') {
ajax = new XMLHttpRequest();
}
return ajax;
}
function post(){
//获取接受返回信息层
var msg = document.getElementById("msg");
//获取表单对象和用户信息值
var f = document.user_info;
var userName = f.user_name.value;
var userAge = f.user_age.value;
var userSex = f.user_sex.value;
//接收表单的URL地址
var url = "http://127.0.0.1/ajax/post/ajax_post.php";
//需要POST的值,把每个变量都通过&来联接
var postStr = "user_name="+ userName +"&user_age="+ userAge +"&user_sex="+ userSex;
//实例化Ajax
var ajax = InitAjax();
//通过Post方式打开连接
ajax.open("POST", url, true);
//定义传输的文件HTTP头信息
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//发送POST数据
ajax.send(postStr);
//获取执行状态
ajax.onreadystatechange = function() {
//如果执行状态成功,那么就把返回信息写到指定的层里
if (ajax.readyState == 4 && ajax.status == 200) {
msg.innerHTML = ajax.responseText;
}
}
}
</script>
结构
<script language="JavaScript" type="text/javascript" src="">
<!-- hide this stuff from other browsers
// end the hiding comment -->
</script>
++++++++++++++++++++++++++++++++++++++
变量
var a,b= 60;
局部变量
function f(){
var a=1;
}
全局变量
var n=5;
function f(){
}
++++++++++++++++++++++++++++++++++++++
数据类型
获取变量的数据类型
typeof(变量名或常量);
++++++++++++++++++++++++++++++++++++++
语句结构
语句的结尾有分号(;)作为终止符号。
++++++++++++++++++++++++++++++++++++++
运算符
逗号:,
赋值:=
字符串连接操作符:+
加:+
减:-
乘:*
除:/
取余:%
递增:++
递减:--
+=,-=,*=,/=,%=
等于:==
不等于:!=
大于:>
小于:<
大于等于:>=
小于等于:<=
恒等于:===
与:&&
或:||
非:!
++++++++++++++++++++++++++++++++++++++
注释
//
/**/
++++++++++++++++++++++++++++++++++++++
流程控制
expression?expression1:expression2
----------
if(){
}
else{
}
----------
switch(){
case C1:
..
break;
case C2:
..
break;
default:
..
}
----------
while(){
}
----------
do{
}while()
----------
for(;;){}
----------
break;
continue;
----------
++++++++++++++++++++++++++++++++++++++
函数
function 函数名(){}
值传递
var s=1;
func(s);
引用传递
var obj=new object();
func(obj);
返回值
return
深入认识函数
function func1(...){...}
var func2=function(...){...}
var func3=function func4(...){...}
var func5=new Function();
function myf(a,b){
return a+b;
}
等价于
var myf=new Function("a","b","return a+b");
下面的定义是等价的
new Function("a","b","c","return a+b+c")
new Function("a,b","c","return a+b+c")
new Function("a,b,c","return a+b+c")
直接在函数声明后面加上括号就表示创建完成后立即进行函数调用
var i=function (a,b){
return a+b;
}(1,2);
alert(i);
将函数作为参数传递
function func1(thefunc){
thefunc();
}
function func2(){
alert("hi");
}
func1(func2);
隐含参数:arguments
function func(a,b){
alert(a);
alert(b);
for(var i=0;i<arguments.length;i++){
alert(arguments[i]);
}
}
//1 2 1 2 3
用this指针来获得该对象自身的引用
++++++++++++++++++++++++++++++++++++++
内部函数
eval()
parseInt()字符串转整数
parseFloat()字符串转浮点数
escape()将字符串编码为url形式
unescape()解码escape()编码的字符串
isNaN()判断是否是数字
isFinite()判断是否是数字
++++++++++++++++++++++++++++++++++++++
对象
Date对象
Date对象用来处理日期和时间
var objDate=new Date();
objDate.getFullYear()//返回年
objDate.getMonth()//返回月
objDate.getDate()//返回日
objDate.getDay()//返回星期
objDate.getHours()//返回小时
objDate.getMinutes()//返回分
objDate.getSeconds()//返回秒
objDate.getTime()//返回GMT时间,1970.1.1起经过的毫秒数
++++++++++++++++++++++++++++++++++++++
Math对象
Math对象用来进行数据运算
四舍五入 Math.round(x)
x=Math.round(x);
随机函数 Math.random()
返回一个0到1之间的小数。
Math.round(Math.random()*随机整数数目)+整数范围的下限
返回100-200的随机整数
Math.round(Math.random()*100)+100
++++++++++++++++++++++++++++++++++++++
Array对象
数组对象
创建数组
var objArray=new Array();//创建一个空数组
var objArray=new Array(10);//创建一个数组,包括10个元素
var objArray=new Array("a","b","c");//以"a","b","c"3个元素初始化一个数组对象
赋初值:
Myarray[1]=“字串1”;
访问数组元素
a=Myarray[0];
内部数组
anchors[]:使用<a name="anchorName">标识来建立锚的链接。
links[]: 使用<a href="URL">来定义一个越文本链接项。
Forms[]: 在程序中使用多窗体时,建立该数组。
Elements[]:在一个窗口中使用从个元素时,建立该数组。
Frames[]:建立框架时,使用该数组
多维数组
定义
var arr=new array(4);
for(var i=0;i<4;i++){
arr[i]=new Array(6);
}
访问
for(var i=0;i<4;i++){
for(var j=0;j<6;j++){
//处理arr[i][j]
}
}
属性
数组长度:objArray.length;
方法
转为字符串:objArray.toString()
以sep指定的字符作为分隔符,将数组转为字符串:objArray.join(sep)
弹出数组最后一个元素:objArray.pop()
将参数加到数组结尾:objArray.push(value)
++++++++++++++++++++++++++++++++++++++
String对象
字符串
属性
字符串长度:str.length;
方法
返回ascii字符:string.charCodeAt();//"abc".charCodeAt(0)返回97
返回长度为length的子字符串:string.substr(start,length);
返回start到end的子字符串string.substring(start,end);
以s作为分隔符切割成多个子字符串:string.split(s);
替换和匹配字符串
搜索出匹配正则的所有子字符串:match(regExp)
字符串中搜索出匹配正则的第一个子字符串:search(regExp)
++++++++++++++++++++++++++++++++++++++
navigator对象
获取浏览器信息
属性
浏览器的正式名称:appName
是否启用了cookie:cookieEnabled
操作平台:platform
浏览器及环境信息:userAgent
var i=navigator.userAgent.toLowerCase().indexOf("firefox");
++++++++++++++++++++++++++++++++++++++
location对象
处理地址栏信息
window.location.href="http://www.163.com";
<a href="javascript:void(0)" onclick="">page</a>
javascript:void(0)使<a>不起作用
++++++++++++++++++++++++++++++++++++++
history对象
历史记录
history.back();//单击[后退]按钮
history.forward();//单击[前进]按钮
history.go(-2);//单击两次[后退]按钮
++++++++++++++++++++++++++++++++++++++
document对象
文档操作
document.write("");//向页面写入数据
document.writeln("")
document.bgColor='white';//改变背景颜色
属性
返回所有表单组成的数组:forms
返回所有图像组成的数组:images
++++++++++++++++++++++++++++++++++++++
window对象
浏览器窗口
新建窗口
window.open(url,windowName,"name1=value1,...");
关闭窗口
window.close();
延时执行一次
setTimeout("function",time);
隔固定时间执行
setInterval("function",time);
属性
状态栏显示的文本:status
默认状态栏信息:defaultStatus
window.status="mesage";
window.defaultStatus="message";
alert("message");//输出
prompt(message,defaultValue);//输入
confirm("message");//[确认][取消]返回true,false
++++++++++++++++++++++++++++++++++++++
事件
onMouseDown onMouseMove onMouseOut onMouseOver onMouseUp
onFocus onBlur onChange onSelect
onKeyDown onKeyPress onKeyUp
onClick onDblClick
function statusreport() {
var tempx = event.clientX + document.body.scrollLeft;
var tempy = event.clientY + document.body.scrollTop;
status='在整个页面中的X, Y坐标 : ('+tempx+', '+tempy+') ; 在当前窗口中的X, Y坐标 : ( '+event.clientX+', '+event.clientY +')';
}
<body onmousemove="statusreport();">
event对象属性
窗口的x坐标:clientX
窗口的y坐标:clientY
屏幕的x坐标:screenX
屏幕的y坐标:screenY
鼠标按键:button
键盘按键:keyCode
按下shift键:shiftKey
按下alt键:altKey
按下ctrl键:ctrlKey
1)
<script language="javascript" type="text/javascript">
<!--
function asy(){
alert("hello");
}
document.onclick=say;
-->
</script>
2)
<textarea id="" name="content"></textarea>
<script language="javascript" type="text/javascript">
<!--
var txt=document.getElementById("content");
txt.onkeydown=function(evt){
evt=evt?evt:window.event;//兼容浏览器
if(evt.ctrlKey &&13==evt.keyCode)thie.form.submit();
}
-->
</script>
++++++++++++++++++++++++++++++++++++++
表单
获得表单
var myform=document.forms["myform"];
Form对象事件
onsubmit在表单提交之前触发
onreset在表单被重置之前触发
引用表单元素
var element=theForm.elements[idex];
var element=theForm.elements[elementName];
遍历一个表单中的所有表单域
for(var i=0;i<theForm.elements.length;i++){
if("checkbox"==theForm.elements[i].type){}
}
表单域的通用属性
1)创建只读(不可用)表单域
element.disabled=true;
element.disabled=false;
2)获取表单域的值
value
表单域的通用方法
表单域获得焦点:focus()
表单域失去焦点:blur()
表单域的通用事件
onFocus:获得焦点时,产生该事件
OnBlur:失去焦点时,产生该事件
--Onselect:文字被加亮显示后(选择),产生该文件。
onchange:表单域的值改变时
onclick:键盘单击
onkeydown:键盘按下
onkeyup:键盘松开
onkeypress:键盘按下松开
onmouseover:鼠标移上
onmouseout:鼠标移出
onmousedown:鼠标按下
onmouseup:鼠标松开
文本域
获取和设置文本域的内容:value
var a=document.the_form.the_text.value;
获得HTML标记中的value值:defaultValue
选中文本:select
<input type="text" name="" onfocus="this.select()">
复选框
当复选框被选中时checked返回true
document.forms[0].elements[i].checked
<script language="javascript">
function get(){
var a=document.getElementsByName("ck");
var b=a.length;
alert(b);
for(var i=0;i<b;i++){
if(a[i].checked){
alert(a[i].value);
}
}
}
</script>
<input type="checkbox" name="ck" value="10">
<input type="checkbox" name="ck" value="20">
<input type="checkbox" name="ck" value="30">
<input type="button" onclick="get()" value="get ck box">
--------------------
var is_checked=document.the_form.the_checkbox.checked;
if (is_checked == true){
alert("Yup, it's checked!");
}
else{
alert("Nope, it's not checked.");
}
单选按钮
checked属性来获取或设置单选按钮的状态
var is_checked=document.form_1.radio_2.checked;
下拉列表框
使用value属性获取和设置下拉列表框的值
使用length属性获取选项个数
使用selectedIndex属性获取当前选项的索引
使用options属性获取选项集合
option对象的selected属性:选中和未选中
select对象的onchange事件:选中项发生变化时
改变该下列选单中<option>标记中所指定的值
window.document.form_1.pulldown_1.options[1].value = 'new_text';
改变该下列选单中的第2个选项值
window.document.form_1.pulldown_1.options[1].text = 'new_text';
选择一个选项,selectedIndex属性将变成被选项的数组索引号
document.form_1.select_1.selectedIndex = 1;
添加一个选项
document.form_1.select_1.options[slt.length]=new Option("value3","text3");
删除一个选项
document.form_1.select_1.options[0]=null;
清空select对象
document.form_1.select_1.length=0;
替换一个选项
document.form_1.select_1.options[1]=new Option("apple","apple");
表单验证
1)<input type="submit" onclick="return validade()">
2)<form action=""method="" onsubmit="return validate()">
验证文本中否为空:
if(tbusername.value.length==0){
alert("");
return false;
}
验证下拉列表是否为空:
if(sltcity.selectIndex==0){
alert("");
return false;
}
++++++++++++++++++++++++++++++++++++++
类
javascript中,函数和类是一个概念
当对一个函数进行new操作就返回一个对象
function class1(){//定义类
//类成员的定义及构造函数
}
var obj=new class1();
动态添加属性
var user=new object();
user.name="aaa";//添加属性
动态添加方法
user.fun=function(){//添加方法
//代码
}
user.fun();//调用fun方法
动态修改属性和方法
user.name="mm";
user.fun=function(){
}
属性删除属性和方法
user.name=undefined;
user.fun=undefined;
使用{}创建无类型对象
属性名和内容之间用冒号(:)隔开
除最后一个属性(方法)定义,其他的必须以逗号(,)结尾
var obj={};//定义一个空对象
var user={
name:"mm",//定义name属性为mm
acolor:["red","green"],//定义数组
fc:function(){//定义方法
alert("hi");
}
}
prototype原型对象
表示了一个类的成员集合
//定义一个空类
function class1(){
}
//对类的prototype对象修改,增加方法method
class1.prototype.method=function(){
alert("aa");
}
var obj1=new class1();//创建实例
obj1.method();//调用方法
++++++++++++++++++++++++++++++++++++++
类的继承
1)通过拷贝一个类的prototype到另外一个类来实现继续
function class1(){}
function class2(){}
class2.prototype=class1.prototype;
class2.prototype.mor="xx";
class2.prototype.fun=function(){}
var obj=new class2();
++++++++++++++++++++++++++++++++++++++
框架
每个框架都对应一个html页面
框架间互相引用(frames)
window.frames["frameName"];
window.frames.frameName
window.frames[index]
其中window可以用self代替或省略
子框架引用父框架(parent)
改变框架的载入页面(location)
window.frames[0].location="1.html"
引用其他框架内的javascript变量和函数
例:
<frameset cols="20%,80%">
<frame src="link.html" name="link">
<frame src="show.html" name="show">
</frameset>
show.html
<a href="void(0)" onclick="self.parent.link.add(12345)">加入购物车</a>
link.html
var arr=new Array();
function add(id){
arr.push(id);
}
++++++++++++++++++++++++++++++++++++++
cookie
设置cookie
document.cookie="userId=828";
document.cookie="userId=828;userName=hulk";
document.cookie="str="+escape("I love js");
值中有特殊符号时用escape()进行编码
用escape()进行编码的值需用unescape()进行编码后
才能得原来的值
获取cookie值
var strcookie=document.cookie;
var strCookie=document.cookie;
var arrCookie=strCookie.split(";");//分多个cookie
for(var i=0;i<arrCookie.length;i++){
var arr=arrCookie[i].split("=");//分cookie的名和值
}
给cookie设置终止日期(expire)
var date=new Date();
...
document.cookie="id=828; expire="date.toGTMstring();
删除cookie
var date=new Date();
date.setTime(date.getTime-10000);//将date设置为过期时间
document.cookie="id=828; expire="+date.toGTMstring();
++++++++++++++++++++++++++++++++++++++
异常处理
1)try-catch-finally
try{
//要执行的代码
}
catch(e){
//处理异常的代码
}
finally{
无论异常发生与否都会执行的代码
}
2)用throw语句抛出异常
if(){
throw new Error("error");
}
++++++++++++++++++++++++++++++++++++++
DOM
直接引用结点
document.getElementById()
<span id="s1"></span>
var span1=document.getElementById(s1);
span1.innerHTML="hi";
引用指定标记名称的结点
document.getElementsByTagName()
<sapn id="s1"></span>
<sapn id="s2"></span>
var arrspan=document.getElementByTagName("span");
for(var i=0;i<arrspan.length;i++){
arrspan[i].innerHTML="hi";
}
++++++++++++++++++++++++++++++++++++++
Ajax
创建
处理
open
头(缓存)
send
GET
<script language="javascript">
function InitAjax(){
var ajax=false;
try {
ajax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajax = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
ajax = false;
}
}
if (!ajax && typeof XMLHttpRequest!='undefined') {
ajax = new XMLHttpRequest();
}
return ajax;
}
function getNews(newsID){
if (typeof(newsID) == 'undefined'){
return false;
}
var url = "http://127.0.0.1/ajax/get/ajax_get.php?id="+ newsID;
var show = document.getElementById("show_news");
var ajax = InitAjax();
ajax.open("GET", url, true);
ajax.onreadystatechange = function() {
if (ajax.readyState == 4 && ajax.status == 200) {
show.innerHTML = ajax.responseText;
//alert(ajax.responseText);
}
}
ajax.send(null);
}
</script>
POST
<script language="javascript">
var ajaxObj = null;
function getXmlHttp(){
var xmlObj = null;
if(window.XMLHttpRequest)
{
xmlObj = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
xmlObj = new ActiveXObject("Microsoft.XMLHTTP");
}
else
{
xmlObj = new XMLHttpRequest();
}
return xmlObj;
}
function updateDiv()
{
ajaxObj = getXmlHttp();
ajaxObj.onreadystatechange = onStateChange;
ajaxObj.open("GET", "http://127.0.0.1/ajax/json.php", true);
ajaxObj.setRequestHeader('If-Modified-Since', '0');
ajaxObj.send(null);
}
function onStateChange()
{
if(ajaxObj.readyState == 4 && ajaxObj.status == 200)
{
var json = eval('(' + ajaxObj.responseText + ')');
document.getElementById("test").innerHTML = json.t2;
}
}
</script>
JSON
<script language="javascript">
function InitAjax()
{
var ajax=false;
try {
ajax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajax = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
ajax = false;
}
}
if (!ajax && typeof XMLHttpRequest!='undefined') {
ajax = new XMLHttpRequest();
}
return ajax;
}
function post(){
//获取接受返回信息层
var msg = document.getElementById("msg");
//获取表单对象和用户信息值
var f = document.user_info;
var userName = f.user_name.value;
var userAge = f.user_age.value;
var userSex = f.user_sex.value;
//接收表单的URL地址
var url = "http://127.0.0.1/ajax/post/ajax_post.php";
//需要POST的值,把每个变量都通过&来联接
var postStr = "user_name="+ userName +"&user_age="+ userAge +"&user_sex="+ userSex;
//实例化Ajax
var ajax = InitAjax();
//通过Post方式打开连接
ajax.open("POST", url, true);
//定义传输的文件HTTP头信息
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//发送POST数据
ajax.send(postStr);
//获取执行状态
ajax.onreadystatechange = function() {
//如果执行状态成功,那么就把返回信息写到指定的层里
if (ajax.readyState == 4 && ajax.status == 200) {
msg.innerHTML = ajax.responseText;
}
}
}
</script>
发表评论
-
JS笔记
2012-09-21 17:02 812JS灵活性中的五种方法: //方法1 ... -
107个常用javascript语句
2011-10-30 16:35 7281.document.write(""); ... -
javascript常用代码(2)
2011-10-30 16:25 789JavaScript常用函数列表 click() 对象 ... -
jquery+jBox 仿QQ空间 DIV窗口
2011-09-19 13:25 1722QQ校友DIV模拟窗口: 既然是要提高用户体验,a ... -
Ajax初例
2011-09-19 10:48 801Ajax_user.html <html> ... -
省市二级联动
2011-09-07 02:24 970<a href="http://www.&qu ...
相关推荐
JAVA常用代码块 JAVA常用代码块 JAVA常用代码块 JAVA常用代码块 JAVA常用代码块
java常用代码方法很适合初学者和刚刚参加工作的程序员,里面包含了常用正则表达式、公共日期类、串口驱动、各种数据库连接、公交换乘算法、 列出某文件夹及其子文件夹下面的文件,并可根据扩展名过滤等等很多有用的...
以下是对标题“java常用代码的集合”和描述中提及的知识点的详细解释,以及与标签相关的具体代码示例。 1. ISBN验证: ISBN(国际标准书号)是用于唯一标识书籍的编码。在Java中,我们可以编写一个方法来验证一个...
本压缩包“java常用代码”集合了一系列基础到进阶的Java代码示例,涵盖了多个关键领域,有助于初学者快速掌握Java编程的核心概念。 1. **遗产算法**:在Java中,继承是面向对象特性之一,它允许一个类(子类)继承...
在"Java常用代码整理"这个主题中,我们可以探讨多个Java编程中的关键知识点,包括基础语法、面向对象特性、异常处理、集合框架、IO流、多线程、网络编程以及实用工具类等。 1. **基础语法**:Java的基础语法包括...
这个名为"java常用算法大全源代码.zip"的压缩包文件显然包含了丰富的Java算法实现,对于学习和提高编程技能非常有帮助。随书光盘的形式表明这可能是某本关于Java算法书籍的配套资源,而“全套”和“注释详细”的描述...
在“Java常用源程序代码”这个压缩包中,我们能够找到一系列与Java编程相关的源代码文件,这些文件被精心组织在不同的文件夹中,每个文件夹都代表着一个特定的主题或功能领域。通过深入研究这些代码,我们可以学习到...
我把在java开发当中一些常用的代码都进行了整理,希望对大家学习java有所帮助
1. **Spring框架概述**:Spring是一个开源的Java平台,它提供了全面的编程和配置模型,用于构建现代Java应用。Spring的核心特性包括依赖注入(DI)和面向切面编程(AOP),这些都使得代码更加模块化和易于测试。 2....
Java常用数值算法集 源代码 何光渝编 iso版本
总结了编写java代码常用的算法代码,如ucs2,ascii,进制转换,以及APN相关的管理代码
1. **基本语法**:Java源代码遵循特定的语法规则,包括变量声明、数据类型(如int, String, boolean等)、控制结构(如if-else, switch, for, while循环)、函数定义、类和对象等。了解这些基础语法是编写Java程序的...
这个名为“Java基本常用代码示例”的资源集包含了Java程序设计中的一些基础和常见代码片段,对于初学者或需要复习基本概念的开发者来说非常有用。下面我们将深入探讨这些标签所涵盖的Java基本知识点。 1. **数据...
"Java常用代码大全.zip"这个压缩包很可能包含了各种常见的Java编程示例和实用代码片段,帮助开发者快速解决日常开发中遇到的问题。这个文档,"Java常用代码大全.doc",可能是一个详细的指南,涵盖了Java开发中的各种...