调试：
IE-》工具-internet选项-高级，调一下“禁止脚本调试”和“显示每个脚本错误的通知”；
定义数组：var arr=new Array(3);不是[]，而是()
arr[0]=1;
arr[1]=2;
arr[2]=2;
arr[3]=3;
arr[4]=4;
document.write(arr[4]);//4
document.write(arr.length);//5
解析：Array(3)里的3是没用的，
javascript里的数组是这样的：里面的下标“1、2、3……”是变量，后边的值
就是变量的值，比如：arr[0]=1;0是变量，1是值。
var arr=new Array(1,2,3,4,22);
var s;
s="hello boy and girl";
document.write(s.substring(4,7));//0 b
s.charAt(0);//h
var t=new Date();
var h=t.getHours();
if(h<12){document.write("morning");}
else if(h==12){document.write("noon");}
else document.write("after noon");
<html>
<head>
<script type="text/javascript">
function test(a)//弱类型的，没有返回值
{
return 2*a;
}
</script>
</head>
<body>
<script type="text/javascript">
alert(test(3));
</script>
</body>
</html>
事件处理：
onFocus:当用户为了输入而选择select、text。textarea等时；
onBlur ：在select,text,testarea失去焦点时；
onChange:在select，text，textarea的值被改变且失去焦点时；
onClick:在一个对象被鼠标点中时（button、checkbox、radio、link、reset、submit、text、、textarea）；
onLoad:出现在一个文档完成对一个窗口的载入时；
onUnload:当用户退出一个文档时；
onMouseOver:鼠标被移动到一个对象上时；
onMourseOut:鼠标从一个对象上移开时；
onSelect:当form对象中的内容被选中时；
onSubmit：提交按钮提交一个表单时；
<button οnclick=" javascript:alert('s');">sf</button>//javascript：可以不要
<html>
<head>
<form name="form1">
<input type="text" name="s" value='ss' onFocus="alert(document.form1.s.value);">
</form>
</body>
</html>
<html>
<head>
<form name="form1">
<img src="xx.jpg" οnclick="alert('a');"></img>
</form>
</body>
</html>
<html>
<head>
<body οnlοad="alert('welcom')" οnunlοad="alert('bye')">
</body>
</html>
<html>
<head>
<form name="form1">
<img src="xx.jpg" οnclick="alert('a');" οnmοuseοver="alert('over');" οnmοuseοut="alert('out');"></img>
</form>
</body>
</html>
<html>
<head>
<form name="form1">
<input type="text" οnselect="alert();" value="sdfsdfs">
</form>
</body>
</html>
<html>
<head>
<form name="form1" action="1.htm" οnsubmit="alert();">//点确定就跳转了，
//οnsubmit="false"就不会跳转，οnsubmit="true"跳转
<input type="submit" value="tiajiao"/>
</form>
</body>
</html>
<html>
<head>
<script type="text/javascript">
function test()
{
if(document.form1.n.value=="")
{
alert("不能为空");
return false;
}
else return true;
}
</script>
</head>
<body>
<form name="form1" action="1.htm" οnsubmit="return test()">
<input type="text" name="n" />
<input type="submit" value="tiajiao"/>
</form>
</body>
</html>
或者：
<html>
<head>
<script type="text/javascript">
var test=function()
{
if(document.form1.n.value=="")
{
alert("不能为空");
return false;
}
else return true;
}
</script>
</head>
<body>
<form name="form1" action="1.htm" οnsubmit="return test()">
<input type="text" name="n" />
<input type="submit" value="tiajiao"/>
</form>
</body>
</html>
prompt的用法：
<html>
<head>
<script type="text/javascript">
var userName=prompt("请输入您的名字:");
document.write(userName);
</script>
</head>
<body>
</body>
</html>
cofirm的用法：
<html>
<head>
<script type="text/javascript">
var c=function()
{
if(confirm("确定删除吗？"))
{
document.form1.submit();
}
}
</script>
</head>
<body>
<form name="form1" action="1.htm">
<button οnclick="c()">删除</button>
</body>
</html>
8、
Javascript的内置对象：
this：当前对象(所有的标签都是对象)
for..in：in后跟一个对象，对此对象中的所有元素循环一次
with：为一段代码建立一个缺省的对象，任何无对象的属性引用，都将使用该缺省的对象
new：用于生成一个新的对象
<html>
<head>
<script type="text/javascript">
var check=function(o)
{
if(o.value=="")
{
alert("不能为空");
}else alert(o.value);
}
</script>
</head>
<body>
<img src="1.JPG" οnclick="alert(this.src);">
<form name="form1">
<input type="text" name="d" οnclick="check(this);">
</form>
</body>
</html>
<html>
<head>
<script type="text/javascript">
a=new Array("sf","23","nihao",13);
for(eee in a)//与java不一样,eee是属性的名字，是下标值
{
document.write(eee+"--->"+a[eee]+"<br>");
}
</script>
</head>
<body>
</body>
</html>
<html>
<head>
<script type="text/javascript">
with(document)//下边的默认的调用document对象
{
write("document的方法");
write("too");
}
</script>
</head>
<body>
</body>
</html>
2、
窗口中的对象和元素
window:
当前窗口；新开窗口；通过本地窗口控制新开窗口。
location：
获取或设置现有的文档的URL
history:
先前访问过的URL的历史列表
常用方法：back(),go(number)
document：当前的文档对象
<html>
<head>
<script type="text/javascript">
window.status="helloFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF";
</script>
</head>
<body>
<button οnmοuseοver="window.status='heihei';">test</button>//观察左下方的变化
</body>
</html>
<html>
<head>
<script type="text/javascript">
while(1){//不停的弹
window.open("1.htm");}//弹出一个新窗口
</script>
</head>
<body>
</body>
</html>
********************************************************
<html>
<head>
<title>这是1.html</title>
<script type="text/javascript">
window.open("1.htm","newWin","toolbar=no,left=200,top=100,munubar=no,width=100,height=100,resizable=no");//newWin是新窗口的名字，resizable表示是否可以改变窗口大小。
</script>
</head>
<body>
</body>
</html>
<html>
<head>
<title>这是1.htm</title>
<script type="text/javascript">
</script>
</head>
<body οnunlοad="window.open('1.htm')">
哈哈
</body>
</html>
**********************************************************
<html>
<head>
<script type="text/javascript">
</script>
</head>
<body>
<button οnclick="window.close();">关闭此窗口</button>
</body>
</html>
<html>
<head>
<title>这是1.html</title>
<script type="text/javascript">
var abc=window.open("1.htm","newWin","toolbar=no,left=200,top=100,munubar=no,width=100,height=100,resizable=no");//newWin是新窗口的名字，resizable表示是否可以改变窗口大小。
</script>
</head>
<body>
<button οnclick="abc.close();">关闭子窗口</button>
</body>
</html>
<html>
<head>
<title>这是1.html</title>
<script type="text/javascript">
alert(window.location);
alert(document.location);//这两句是一样的
</script>
</head>
<body>
</body>
</html>
******************************
<html>
<head>
<title>这是a.html</title>
<script type="text/javascript">
</script>
</head>
<body>
<button οnclick="window.location='1.htm';">跳转</button>
</body>
</html>
<html>
<head>
<title>这是1.html</title>
<script type="text/javascript">
</script>
</head>
<body>
<button οnclick="history.back();">返回</button>//相当于点返回按钮
</body>
</html>
******************************
3、
下拉列表的javascript简单实现
<html>
<head>
<title>这是a.html</title>
<script type="text/javascript">
function changeDrop2()
{
if(document.form1.drop1.selectedIndex==0)
{
document.form1.drop2.length=1;
document.form1.drop2.selectedIndex=0;
document.form1.drop2.options[0].text="您还没选择省市";
document.form1.drop2.options[0].value="----";
}
if(document.form1.drop1.selectedIndex==1)
{
document.form1.drop2.length=2;
document.form1.drop2.selectedIndex=0;
document.form1.drop2.options[0].text="广州";
document.form1.drop2.options[0].value="广州";
document.form1.drop2.options[1].text="湛江";
document.form1.drop2.options[1].value="湛江";
}
if(document.form1.drop1.selectedIndex==2)
{
document.form1.drop2.length=2;
document.form1.drop2.selectedIndex=0;
document.form1.drop2.options[0].text="开封";
document.form1.drop2.options[0].value="开封";
document.form1.drop2.options[1].text="许昌";
document.form1.drop2.options[1].value="许昌";
}
if(document.form1.drop1.selectedIndex==3)
{
document.form1.drop2.length=2;
document.form1.drop2.selectedIndex=0;
document.form1.drop2.options[0].text="武汉";
document.form1.drop2.options[0].value="武汉";
document.form1.drop2.options[1].text="黄冈";
document.form1.drop2.options[1].value="黄冈";
}
}
</script>
</head>
<body><form name="form1">
省市：<select name="drop1" size="1" οnchange="changeDrop2();">
<option value="null">选择省市</option>
<option value="广东省">广东省</option>
<option value="河南省">河南省</option>
<option value="湖北省">湖北省</option>
</select><br>
城市：<select name="drop2" size="1">
<option value="">----</option>
<option value="">----</option>
</select>
</form>
</body>
</html>
4、
span和div的用法，不用的用户体验
<HTML>
<head>
<script type="text/javascript">
var flag=false;
function check(ss){
if(ss.length>7||ss.length<3){
document.getElementById("usernameErrdiv").innerHTML="<font color='red'>必须是
4~6位！</font>";
document.getElementById("usernameErrspan").innerHTML="<font color='red'>必须是
4~6位！</font>";
flag=false;
}
else
{
document.getElementById("usernameErrdiv").innerHTML="";
document.getElementById("usernameErrspan").innerHTML="";
flag=true;
}
}
function sub()
{
if(flag)return true;
else return false;
}
</script>
</head>
<body>
<form name="form1" οnsubmit="return sub();">
<input type="text" name="username" size="30" maxlength="10" οnblur="check
(this.value.toLowerCase());">
<span id="usernameErrspan"></span><!--在后边显示,一般用此法!!-->
<div id="usernameErrdiv"></div><!--在下边显示-->
<input type="submit" value="提交">
</form>
</body>
</HTML>
5、
帧iframe:在网页内挖出一个空填放另一个网页
<HTML>
<head>
<script type="text/javascript">
</script>
</head>
<body>
<iframe name="i" width="50%" height="50%" src="1.htm"/>
</body>
</HTML>
扫一扫
1087
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
