脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-JavaScript开发教程，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。

JavaScript开发教程。

保留两位小数：

Function round(num){

return Math.round(num*100)/100;

}

生成随机数

Function rand(num){

Return Math.floor(Math.random()*num)+1;

}

11， WITh关键字

With关键字指定一个对象，后面跟着大括号的一个语句块，对于语句块中的每一条语句，没有指定对象的属性都将被假定为该对象的属性。从而可以节约写的代码的时间。

VAR str = “abcdefg”;

With(str){

Alert(toUpPErCase()+“,”+length);

}

12， Date对象

Date对象的创建：

Var date = new Date() // 创建当前时间。

Var date = new Date(2011, 9, 20);

Var date = new Date(2011, 9, 20, 15, 30, 20);

setDate()：设置某日

setMonth()：设置某月

setFullYear()：设置某年

setTime()：设置时间

setHours()：设置小时

setMinutes()：设置分钟

setSeconds()：设置秒

getDate()：获取某日

getMonth()：获取某月

getFullYear()：获取某年

getTime()：获取时间

getHours()：获取小时

getMinutes()：获取分钟

getSeconds()：获取秒

根据日期排序时间

var arr = new Array();

arr[0] = new Date();

arr[1] = new Date(2001, 3, 28);

arr[2] = new Date(2002, 6, 25);

arr[3] = new Date(2002, 6, 24);

alert(arr[1].getDate());

function arcompare(da, db){

return da.getDate() - db.getDate();

}

arr.sort(arcompare);

alert(arr[1].getDate());

13， Event对象

Event属性：不同浏览器的event对象属性不同

IE：

event.button—按下鼠标键，对于鼠标左键，这个属性值为1，而对于鼠标右键通常为2;

event.clientX—事件发生位置的X轴坐标(列，以像素为单位)。

event.clientY—事件发生位置的Y轴坐标(行，以像素为单位)。

event.ctlKey—表示事件发生时是否按下CTRL键

event.altKey—表示事件发生时是否按下ATL键

?

event.shiftKey—表示事件发生时是否按下SHIFT键

event.keyCode—表示按键的Unicode码。

event.srcElement—元素出现的对象。

Firefox：

event.button—按下鼠标键，对于鼠标左键，这个属性值为0，而对于鼠标右键通常为2;

event.modifiers—表示事件发生时按下了那一个修饰键。(atl，ctrl， shift)

event.pageX—事件发生位置的X轴坐标(列，以像素为单位)。

event.pageY—事件发生位置的Y轴坐标(列，以像素为单位)。

event.which—表示按键的Unicode码。

event.target—元素出现的对象。

按键显示

function displaykey(e){

if(e.keyCode) var keycode = e.keyCode;

else keycode = e.which;

var charvar = String.FromCharCode(keycode);

var ke = document.getElementById("keydis");

ke.innerHTML += charvar;

}

14， 打开和关闭窗口，调整窗口大小和位置。

Window.open()：打开窗口。

Window.close()：关闭窗口。

Window.moveTo(x,y)：移动窗口的位置—绝对

Window.moveBy(x,y)：移动窗口的位置—相对

Window.resizeTo(w,h)：调整窗口的大小—绝对

Window.resizeBy(w,h)：调整窗口的大小—相对

var newwin;

function opnewwin(){

newwin = window.open("", "nwin", "toolbar=no, status=no, width=200, height=100");

}

function closenewwin(){

newwin.close();

}

function movenewwin(){

var w = document.theform.w.value;

var h = document.theform.h.value;

var x = document.theform.x.value;

var y = document.theform.y.value;

if(w && h){

newwin.resizeTo(w, h);

}

if(x && y){

newwin.moveTo(x, y);

}

}

width: height:

x-postion: y-postion:

15， Js超时功能

Var indent = window.setTimeOut(“alert(‘aa’)”, 1000);//1000毫秒后执行一次alert

Window.clearTimeOut(ident);//停止超时事件

刷新

Var count = 0;

Function updatePage(){

Count++;

Var id = window.setTimeOut(“updatePage()”,1000);

}

16， Window显示对话框

Window对话框有三种：

Window.alert(msg)：消息对话框

Window.confirm(msg)：确认对话框

Window.prompt(msg，default)：输入对话框

17， 获取表单中元素

document.getElementById(Id);//返回具有指定id属性的元素

document.getelementsbytagname(tag);//返回具有指定标签名的所有元素的一个数组。可以使用同配符(*)返回含有文档中所有节点的一个数组。

document.formName.elementName;//

18， Text和textarea事件

focus()：设置文本输入焦点事件

blur()：设置文本输入焦点离开事件

select()：设置文本选择事件

onFocus：文本输入焦点时发生的事件

onBlur：文本输入失去焦点时发生的事件

onChange：文本改变后失去失去光标时发生的事件

onSelect：文本输入中文本被选择时发生的事件

焦点事件

function focusinput(){

alert("请先输入用户名");

document.theform.inp.focus();

}

用户名：

密码：

19， Js改变CSS样式

document.getElementById(id).style.css=value

改变CSS颜色

function changesele(){

var val = document.theform.sele.value;

document.getElementById("p").style.color=val;

}

test color

blueredgray

在一些CSS属性的名称中间有连字符，比如border-color等，在js中使用这类属性时，连字符隔开的两部分要合并在一起，连字符后半部分采用首字母大写形式。如borderColor。

20， 节点属性和操作方法

节点属性：

nodeName：节点名称，如

标签名称为DIV，标签名称为INPUT，文档节点document名称为#document，文本节点的名称为#text。

nodeType：描述节点类型的一个整数，1表示正常的htML标签，3表示文本节点，9表示文档节点。

nodeValue：是文本节点包含的实际文本，这个属性对于其他类型的节点无效。

InnerHTML：是任意节点的html内容。

FirstChild：是节点的第一个子对象。

lastChild：是节点的最后一个子对象。

childNodes：是节点的所有子节点的数组

previousSibling：是节点之前的兄弟节点。

nextSibling：是节点之后的兄弟节点。

parentNode：是节点的父节点。

document节点的操作方法：

createTextNode(text); 创建一个文本节点。

createElement(tag); 创建一个html元素。

页面中的节点方法：

appendChild(new); 把指定的新节点添加在该对象所有现有节点自后。

insertBefore(new,old); 把指定的新子节点插入到指定的原有子节点之前。

replaceChild(new,old); 把新节点替换指定的原有子节点。

removeChild(node); 从对象中删除一个子节点。

hasChildNodes();判断对象是否含有子节点，有返回true，无返回false。

cloneNode(); 为某个现有节点创建一个副本，如果传入true的参数，则该副本包括原始节点的所有子节点。

树形菜单：

[-] one menu

one child1

one child2

[-] two menu

two child1

two child2

21， 添加多事件处理程序

Window.addEventListener(“name”, fun, boolean); 为事件(name事件名称)添加事件(fun事件处理函数)，boolean标明事件处理标志位，指明如何处理多个事件，一般设置为false。IE6,IE7和IE8没有提供对它的支持。

Window.removeEventListener(“name”, fun, boolean); 为事件(name事件名称)删除事件(fun事件处理函数)。

Window.attanchEvent(“name”,fun); IE6,IE7和IE8支持该事件添加函数。

Window.detachEvent(“name”, fun);

Window.addEventListener(“click”, clickfun, false);

Window.attanchEvent(“onClick”, clickfun);

添加单击事件

aaa

22， 浏览器信息。

navigator导航器对象，js通过该对象可以读取用户浏览器的信息。

navigator.userAgent; 用户代理头信息，请求web页面时，浏览器发送给web服务器的字符串。

navigator.appName; 浏览器的名称。

Navigator.appversion; 浏览器版本号。

Navigator.appCodeName; 浏览器内部代码名称。

Navigator.language; 浏览器使用语言。如en_US表示为U.S

Navigator.platform; 计算机平台系统。

跨浏览器的js支持可以使用：功能检测技术。

 

觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ js脚本，巧夺天工，精雕玉琢。小宝典献丑了！

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-JavaScript开发教程全部内容，希望文章能够帮你解决javascript代码实例教程-JavaScript开发教程所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。