2015/12/13 --高级javascript实例和部分javascript对象实例-CSDN博客

<html>

<head>

//替换字符串中的字符--replace()方法

var str = "Do you love me?";

document.write(str.replace (/me/who));

//查找字符串中指定的字符，若找到，返回该字符。---match()方法

var str = "hello kitty";

document.write(str.match("kitty") + "<br />");

document.write(str.match("kitty1") + "<br />");

document.write(str.match("kitty!"));

//返回字符串中指定文本首次出现的位置---indexof()方法

var str = "hello world";

document.write(str.indexof("hello") + "<br>");

document.write(str.indexof("world") + "<br>");

document.write(str.indexof("world"));

//返回字符串长度

var txt = "welcome to my world!";

document.write(txt.length);

//为字符串添加样式

document.write("<p>Big:" + txt.big()+"</p>");

document.write("<p>Small:" + txt.Small() +"</p>");

document.write("<p>Bold:" + txt.bold() +"</p>");

document.write("<p>Italics:" + txt.italic() +"</p>");

document.write("<p>Blink:" + txt.blink() + "</p>");

document.write("<p>Fixed:" + txt.fixed() + "</p>");

document.write("<p>Strike:" + txt.strike() + "</p>");

dcument.write("<p>Fontcolor:" + txt.fontcolor("blue") + "</p>");

document.write("<p>Fontsiize:" + txt.fontsize(13) + "</p>");

document.write("<p>Uppercase:" + txt.uppercase() + "</p>");

document.write("<p>Lowercase:" + txt.lowercase() + "</p>");

document.write("<p>Suberscript:" + txt.sub() +"</p>");

doxument.write("<p>Superscript:" + txt.sup() + "</p>");

document.write("<p>Link:" + txt.link("http://www.baidu.com") + "</p>");

//创建用于对象的模版

function person(firstName,lastName,age,eyeColor){

this.firstName = firstName;

this.lastName = lastName;

this.age = age;

this.eyeColor = eyecolor;

}

mydear = new person("snoopy","peter",24,"black");

document.write(mydear.firsrName+ "的眼睛颜色是" + mydear.eyeColor);

//创建对象的实例

personObj = new Object();

personObj.firstName = "snoopy";

personObj.age = 35;

personObj.lastName = "abandon";

personObj.eyeColor = "blue";

document.write(personObj.firstName + "的年龄是" + personObj.age + "岁");

//使用计时事件制作的钟表

function startTime(){

var today = new Date();

var h = today.getHours();

var m = today.getMinutes();

var s = today.getSeconds();

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;

}

//带有停止按钮的无穷循环的计时事件

var c1 = 0;

var t1;

function timedCount(){

document.getElementById("txt").value = c1;

c1++;

t1 = setTimeout("timedCount()",1000);

}

function stopCount(){

c = 0;

setTimeout("document.getElementById("txt").value = 0",0);

clearTimeout(t);

}

//在一个无穷循环的计时事件

var c = 0;

var t;

function timedCount(){

document.getElementById("txt").value = c;

c++;

t = setTimeout("timedCount()",1000);

}

//另一个简单的计时

function timedText1(){

var t1 = setTimeout("document.getElementById ("txt").value = "two seconds"",2000);

var t2 = setTimeout("document.getElementById("txt").value = "four seconds"" ,4000);

var t3 = setTimeout("document.getElementById("txt").value = "six seconds"",6000);

}

//简单的计时

function timedMsg(){

var t = setTimeout(alert("5 secons!"),5000);

}

//添加了javascript的图像映射

function writeText(txt){

document.getElementById("desc").innerHTML = txt;

}

//按钮动画

function mouseOver(){

document.b1.src = "1.jpg"

}

function mouseOut.b1.src = "2.jpg";

</script>

</head>

//用计时事件制作的钟表

//带有停止按钮的无穷循环中的计时事件。

<form>

</form>

<p>请点击上面的计时按钮，输入框会从0开始一直计数。点击停止按钮，计数将会从0重新开始。</p>

//一个无穷循环的计时事件

<form>

</form>

<p>请点击上面的按钮，输入框会从0开始计算并且停止。</p>

//另一个简单的计时

<form>

</form>

<p>点击上面的按钮，输入框会显示逝去的时间。（2秒，4秒，6秒）</p>

//简单的计时

<form>

</form>

<p>请点击按钮，警示框会在5秒后显示。</p>

//添加了javascript的图像映射

<area shape = "circle" coords = "130,139,20" onMouseOver = writeText("从地球上是很难研究水星的，这是由于它和太阳的距离总是很近。") href = "/index.html"

target ="_blank" alt = "Mercury">

//按钮动画

</body>

</html>

转载于:https://www.cnblogs.com/whatcanido/p/5043572.html