一个javaScript程序:
<html>
<head>
my first JavaScript!
</head>
<body>
<br>
this is a normal HTML document
<br>
<script language="JavaScript">
<!--
document.write("这是用javaScript显示的!")
//-->
</script>
<br>
back in HTML again
</body>
</html>
JavaScript代码由<script language="JavaScript">...</script>说明,在标识符<script>与</script>之间就可以加入JavaScript脚本。
闭包
“官方”的解释是:闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分。
相信很少有人能直接看懂这句话,因为他描述的太学术。其实这句话通俗的来说就是:JavaScript中所有的function都是一个闭包。不过一般来说,嵌套的function所产生的闭包更为强大,也是大部分时候我们所谓的“闭包”。看下面这段代码:
function a() { var i = 0; function b() { alert(++i); } return b;}
var c = a();
c();//i==1
c();//i==2
这段代码有两个特点:
函数b嵌套在函数a内部;
函数a返回函数b。
for...in 语句
for...in 语句用于对数组或者对象的属性进行循环操作。
var u1=new User();
u1.uname="张三";
u1.age="18";
var content="";
for(var key in u1){
content += key+": "+u1[key]+"<br/>";
}
document.getElementById("content").innerHTML = content;
}
结果为:
uname: 张三
age: 18
var mycolors = new Array(‘blue‘,‘red‘,‘yellow‘);
function f1(){
var content="";
for(var key in mycolors){
content += key+": "+mycolors[key]+"<br/>";
}
document.getElementById("content").innerHTML = content;
}
结果为:
0: blue
1: red
2: yellow
new constructor[(arguments)]
其中constructor是必选项。对象的构造函数。如果构造函数没有参数,则可以省略圆括号。
arguments是可选项。任意传递给新对象构造函数的参数。
JavaScript中new运算符说明
new 运算符执行下面的任务:
创建一个没有成员的对象。
为那个对象调用构造函数,传递一个指针给新创建的对象作为 this 指针。
然后构造函数根据传递给它的参数初始化该对象。
示例
下面这些是有效的 new 运算符的用法例子。 my_object = new Object;
my_array = new Array();
my_date = new Date("Jan 5 1996");
var i = new Number( ‘1‘ );
var b = new Boolean( true );
var s = new String( ‘a‘ );
var temp = function( a, b )
{
this.a = a;
this.b = b;
}
var t = new temp;
function test(a,b){
document.write(a);
document.write(b);
}
var t=new test(‘bb‘,‘b‘);
//创建t时会调用test函数
Object
我们可以认为 Object 是一个特殊的“类”,而这里的“类”即:function
同时,js中,所有对象(不包括js语言外部对象)都可视为是 Object 的一个实例, Function 不例外.
*****************
javascript 中 "undefined" 与 "is not defined" 分析
方式1属于undefined
var age;
console.log(typeof age === ‘undefined‘);//只能用 === 运算来测试某个值是否是未定义的,因为 == 运算符认为 undefined 值等价于 null。
方式2属于is not defined
console.log(age1 === undefined);//null 表示无值,而 undefined 表示一个未声明的变量,或已声明但没有赋值的变量,或一个并不存在的对象属性。
如果不声明age1.方式2会报错.未声明的变量(is not defined)参与typeof运算是可以的.
某个输入框中注册回车事件,一般用于用户在页面输入后按回车:
<script>
function enterIn(evt){
var evt=evt?evt:(window.event?window.event:null);//兼容IE和FF
if (evt.keyCode==13){
var obj ;
queryDistrict(obj,2);
}
}
</script>
<input type="text" id ="input1" maxlength="3" onkeydown="enterIn(event);"/>
*********************
javascript函数指定命名空间:
下面为函数show()指定了命名控件com.corejsf,那么调用此函数则需要这样调用:com.corejsf.show("fff");
if(!com) var com={};
if(!com.corejsf){
com.corejsf={
*******************
js获取url问号后面的参数值
第一种方法:
function getParam(name){
var search = document.location.search;
var pattern = new RegExp("[?&]"+name+"\=([^&]+)", "g");
var matcher = pattern.exec(search);
var items = null;
if(null != matcher){
try{
items = decodeURIComponent(decodeURIComponent(matcher[1]));
}catch(e){
try{
items = decodeURIComponent(matcher[1]);
}catch(e){
items = matcher[1];
}
}
}
return items;
};
alert(getParam("ni"));//执行函数
第二种方法:
function GetRequest()
{
var url = location.search; //获取url中"?"符后的字串
var theRequest = new Object();
if(url.indexOf("?") != -1)
{
var str = url.substr(1);
var strs = str.split("&");
for(var i = 0; i < strs.length; i ++)
{
theRequest[strs[i].split("=")[0]]=(strs[i].split("=")[1]);
}
}
return theRequest;
}
var Request=new Object();
Request=GetRequest();
alert(Request["ni"]);//获取对应的参数值
*******************
javascript获得窗口滚动条信息
function getScroll() {
var t, l, w, h;
if (document.documentElement && document.documentElement.scrollTop) {
t = document.documentElement.scrollTop;
l = document.documentElement.scrollLeft;
w = document.documentElement.scrollWidth;
h = document.documentElement.scrollHeight;
} else if (document.body) {
t = document.body.scrollTop;
l = document.body.scrollLeft;
w = document.body.scrollWidth;
h = document.body.scrollHeight;
}
*/
function paramFun(parray){
var str=‘‘;
for(var i=0;i<parray.length;i++){
if(parray[i].indexOf(‘,‘)>0){
var arr=parray[i].split(",");
var k=$("#"+arr[0]).val();
var v=jQuery.trim($("#"+arr[1]).val());
if($("#"+arr[1]).attr("type")==‘checkbox‘ && !$("#"+arr[1])[0].checked)
v=‘‘;
}else{
var tk=jQuery.trim($("#"+parray[i]).val());
var tv=$("#"+parray[i]).attr("name");
if($("#"+parray[i]).attr("type")==‘checkbox‘ && !$("#"+parray[i])[0].checked)
tv=‘‘;
***********************
js时间戳转换为时间格式
function formatDate(now) {
var year=now.getYear();
var month=now.getMonth()+1;
var date=now.getDate();
var hour=now.getHours();
var minute=now.getMinutes();
var second=now.getSeconds();
return year+"-"+month+"-"+date+" "+hour+":"+minute+":"+second;
}
var d=new Date(1230999938);
alert(formatDate(d));
************************
js在html中的执行顺序
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<head runat="server">
<title>测试js的执行顺序</title>
<script language="javascript" type="text/javascript">
var a = "1这是一段在Header里面的JS代码";
alert(a);
alert($("#form1").length);
</script>
</head>
<body onload="javscript:alert(‘3这是在body的Onload事件中的代码!‘);">
<form id="form1" runat="server">
<div>
<p>测试一下js的执行顺序
</p>
</div>
</form>
<script language="javascript" type="text/javascript">
var a = "2这是一段页面最后的JS代码";
alert(a);
alert($("#form1").length);
</script>
</body>
</html>
页面上js代码的执行顺序,首先是从上到下执行<head></head>中的js,然后是从上到下解析和执行<body></body>中的html元素和js代码,最后执行onload的js。
function add(a,b)
{
alert(a+b);
}
function sub(a,b)
{
alert(a-b);
}
add.call(sub,3,1);
这个例子中的意思就是用 add 来替换 sub,add.call(sub,3,1) == add(3,1) ,所以运行结果为:alert(4); // 注意:js 中的函数其实是对象,函数名是对 Function 对象的引用
function Class1()
{
this.name = "class1";
this.showNam = function()
{
alert(this.name);
}
}
function Class2()
{
this.name = "class2";
}
var c1 = new Class1();
var c2 = new Class2();
c1.showNam.call(c2);
注意,call 的意思是把 c1 的方法放到c2上执行,原来c2是没有showNam() 方法,现在是把c1 的showNam()方法放到 c2 上来执行,所以this.name 应该是 class2,执行的结果就是 :alert("class2");
**************
用IE 8打开页面时,有时会出现这样的提示:
Message: HTML Parsing Error: Unable to modify the parent container element before the child element is closed (KB927917)
一种解决办法是安装:IE8的KB2416400补丁。
另一种解决办法是将元素加载后就执行的js代码不要放在body的元素中执行,应该放在$(function(){ ... });或$(document).ready(function(){ ... });中执行或body后
参数传递时注意:
引用传递:传给函数的是数值的一个引用,函数中对其属性的修改外部可见,但用新引用覆盖其则在外部不可见,比如
var a = [1, 2, 3];
var b = [5, 6];
function change(a,b) {
a[0] = 4; //对其属性的修改外部可见
var c = a;
a = b; //用新引用覆盖
b = c;
alert(a); //"5,6"
alert(b); //"4,2,3"
}
change(a,b);
alert(a); //"4,2,3"
alert(b); //"5,6"
从结果可以看出a和b并没有互换 因为用新引用覆盖在外部不可见 这个很自然 因为函数只是拿到了引用并没有权力更改全局a,b的引用。
下面这个就不同了
var a = [1, 2, 3];
var b = [5, 6];
function change() {
var c = a;
a[0] = 4;
a = b;
b = c;
};
change();
alert(a); //"5,6"
alert(b); //"4,2,3"
这里成功实现互换
又得提到js的块级作用域了,这个放某些语言里定然是要报未定义错误的,因为js没有块级作用域,所以它在change里找不到变量a,b就会自觉的到上层去找,所以这里的a,b是全局变量的引用
而上面的那个a,b则是change函数中的变量,在调用函数时传递了a,b的引用赋给了这两个变量,但是并不能改变全局中的a,b,所以上面的a,b不会互换了而下面的互换了