javascript笔记
javascript学习笔记
<script>
function change(){
x = document.getElementById("demo");//找到元素
x.innerHTML = "change the element";//也可以写在一起documen.getElementbyId("demo").innerHTML="change the
element";
x.style.color = "#ff0000"; //改变内容、颜色、图片等任意HTML元素的大多数属性
}
</script>
如需从 JavaScript 访问某个 HTML 元素,您可以使用 document.getElementById(id) 方法。
请使用 "id" 属性来标识 HTML 元素:
JavaScript 对大小写是敏感的。
JavaScript 会忽略多余的空格。您可以向脚本添加空格,来提高其可读性。html中用<pre></pre>标签可以显示任意的空格
您可以在文本字符串中使用反斜杠对代码行进行换行(在结构如:document.write/
("123");处不可以)。如:
document.write("Hello /
Word!");
在代码开始处,统一对需要的变量进行声明。
Undefined 这个值表示变量不含有值。
可以通过将变量的值设置为 null 来清空变量。
========
数组:
如果你需要在数组内指定数值或者逻辑值,那么变量类型应该是数值变量或者布尔变量,而不是字符变量。
声明并初始化一个数组
var cars = new Array();
cars[0] = "Audi";
cars[1] = "BMW";
cars[2] = "Volvo";
或者
var cars = ["Audi","BMW","Volvo"];是中括号"[]"。!!
//使用 sort() 方法从字面上对数组进行排序。
document.write(arr.sort());
//使用 sort() 方法从数值上对数组进行排序。
function sortNumber(a, b)
{
return a - b
}
var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"
document.write(arr + "<br />")
document.write(arr.sort(sortNumber))
//输出:
10,5,40,25,1000,1
1,5,10,25,40,1000
Array对象属性 :constructor 返回对创建此对象的数组函数的引用
prototype 使你有能力向对象添加属性和方法
arr1.concat(arr2);//合并数组
var arr = new Array(3);
join()将数组的所有元素组成一个字符串
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
document.write(arr.join());
document.write("<br />");
document.write(arr.join("."));
//结果join("连接符")默认为“,”
George,John,Thomas
George.John.Thomas
对象:
创建对象的实例:(类似构造函数)
------
<script type="text/javascript">
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname
this.lastname=lastname
this.age=age
this.eyecolor=eyecolor
}
myFather=new person("John","Adams",35,"black")
document.write(myFather.firstname + " 的年龄是 " + myFather.age + " 岁。")
</script>
---------
对象由花括号分隔。在括号内部,对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔
var person={firstname:"Bill", lastname:"Gates", id:5566};
或
var person = {};
person.firstname = "Bill";
person.lastname = "Gates";
person.id = 5566;
当您声明新变量时,可以使用关键词 "new" 来声明其类型
var carname=new String;
var x= new Number;
var y= new Boolean;
var cars= new Array;
var person= new Object;
如果把数字与字符串相加,结果将成为字符串
x = 5;
===全等(值和类型) x===5 为 true;x==="5" 为 false
break 语句用于跳出循环。
continue 语句中断循环中的迭代,如果出现了指定的条件,然后继续循环中的下一个迭代。
JavaScript 标签(类似C#的goto语句,需在语句前带":")
continue 语句(带有或不带标签引用)只能用在循环中。
break 语句(不带标签引用),只能用在循环或 switch 中。
通过标签引用,break 语句可用于跳出任何 JavaScript 代码块:
删除元素
找到您希望删除的子元素,然后使用其 parentNode 属性来找到父元素
var child=document.getElementById("p1");
child.parentNode.removeChild(child);
====
为字符串添加样式
var txt="Hello World!"
document.write("<p>Big: " + txt.big() + "</p>")
使用 indexOf() 来定位字符串中某一个指定的字符首次出现的位置。(位置从零开始,有则返回位置,无则返回-1)
var str1 = "abcdefg"; var str2 = "ef"; str1.indexOf(str2);(indexof没反应)
使用 match() 来查找字符串中特定的字符,如果找到的话,则返回这个字符。没有返回null。
使用 replace() 方法在字符串中用某些字符替换另一些字符。
var str="Visit Microsoft!"
document.write(str.replace(/Microsoft/,"W3School"))
====
时间日期
Date 对象自动使用当前的日期和时间作为其初始值。
如果增加天数会改变月份或者年份,那么日期对象会自动完成这种转换。
表示月份的参数介于 0 到 11 之间。也就是说,如果希望把月设置为 8 月,则参数应该是 7。
var myDate=new Date()
myDate.setFullYear(2013,7,14) //时间是8月
document.write(Date());//返回当日的日期和时间
var d=new Date();
document.write("从 1970/01/01 至今已过去 " + d.getTime() + " 毫秒");
//从 1970/01/01 至今已过去 1364279806425 毫秒
var time=new Date().getHours();//获取小时数
====
在 JavaScritp 中使用计时事件是很容易的,两个关键方法是:
setTimeout() //var t=setTimeout("javascript语句",毫秒)
setTimeout (表达式,延时时间)
setTimeout(表达式,交互时间)
延时时间/交互时间是以豪秒为单位的(1000ms=1s)
setTimeout 在执行时,是在载入后延迟指定时间后,去执行一次表达式,仅执行一次
setTimeout 在执行时,它从载入后,每隔指定的时间就执行一次表达式
未来的某时执行代码
clearTimeout() //clearTimeout(setTimeout_variable)
取消setTimeout()
在网页上显示一个钟表
<script type="text/javascript">
function startTime()
{
var today=new Date()
var h=today.getHours()
var m=today.getMinutes()
var s=today.getSeconds()
// in front ofadd a zero numbers<10
m=checkTime(m)
s=checkTime(s)
document.getElementById('txt').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime()',500)
}
function checkTime(i)
{
if (i<10)
{i="0" + i}
return i
}
</script>
====
Math算数对象:执行常见的算术任务(Math.round(3.49)结果3)
round()返回最近的整数值
random()返回0到1之间的随机数
=========
RegExp正则表达式??
RegExp 对象有 3 个方法:test()、exec() 以及 compile()。
test() 方法检索字符串中的指定值。返回值是 true 或 false。
通过 new 关键词来定义 RegExp 对象。以下代码定义了名为 patt1 的 RegExp 对象,其模式是 "e":
var patt1=new RegExp("e");//当您使用该 RegExp 对象在一个字符串中检索时,将寻找的是字符 "e"。
document.write(patt1.test("The best things in life are free"));
exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配,则返回 null。
compile() 方法用于改变 RegExp。既可以改变检索模式,也可以添加或删除第二个参数。
===========
三种消息框
警告框 alert("文本");
确定框 Confirm("text");
提示框 prompt("文本","默认值");
cookie???
==============
try...catch 实例
------
<script type="text/javascript">
var txt=""
function message()
{
try
{
adddlert("Welcome guest!")
}
catch(err)
{
txt="本页中存在错误。\n\n"
txt+="错误描述:" + err.description + "\n\n"
txt+="点击“确定”继续。\n\n"
alert(txt)
}
}
</script>
-------
<script type="text/javascript">
var txt=""
function message()
{
try
{
adddlert("Welcome guest!")
}
catch(err)
{
txt="本页中存在错误。\n\n"
txt+="点击“确定”继续查看本页,\n"
txt+="点击“取消”返回首页。\n\n"
if(!confirm(txt))
{
document.location.href="/index.html"
}
}
}
</script>
-------
<script type="text/javascript">
var x=prompt("请输入 0 至 10 之间的数:","")
try
{
if(x>10)
throw "Err1"
else if(x<0)
throw "Err2"
else if(isNaN(x))
throw "Err3"
}
catch(er)
{
if(er=="Err1")
alert("错误!该值太大!")
if(er == "Err2")
alert("错误!该值太小!")
if(er == "Err3")
alert("错误!该值不是数字!")
}
</script>
-------
==============