JavaScript怎么写就能让字在网页中一个一个打出来

2023-04-15 07:11:02JavaScript011

JavaScript怎么写就能让字在网页中一个一个打出来,第1张

试试看看，是不是这个

var layers =document.layers,style=document.all,both=layers||style,idme=908601

if(layers){layerRef='document.layers'styleRef =''}if(style){layerRef='document.all'styleRef =

'.style'}

function writeOnText(obj,str){

if(layers)with(document[obj]){ document.open()document.write(str)document.close()}

if(style)eval(obj+'.innerHTML=str') }

var dispStr=new Array("这是逐个出现的文字———junly!!")

var overMe=0

function txtTyper(str,idx,idObj,spObj,clr1,clr2,delay,plysnd){

var tmp0=tmp1= '',skip=100

if (both &&idx<=str.length) {

if (str.charAt(idx)=='<'){ while(str.charAt(idx)!='>') idx++idx++}

if (str.charAt(idx)=='&'&&str.charAt(idx+1)!=' '){ while (str.charAt(idx)!= '')idx++idx++}

tmp0 = str.slice(0,idx)

tmp1 = str.charAt(idx++)

if (overMe==0 &&plysnd==1){

if (navigator.plugins[0]){

if(navigator.plugins["LiveAudio"][0].type=="audio/basic" &&navigator.javaEnabled()){document.embeds

[0].stop()

setTimeout("document.embeds[0].play(false)",100)}

} else if (document.all){

ding.Stop()

setTimeout("ding.Run()",100)}

overMe=1}else overMe=0

writeOnText(idObj, "<span class="+spObj+"><font color='"+clr1+"'>"+tmp0+"</font><font color='"+clr2

+"'>"+tmp1+"</font></span>")

setTimeout("txtTyper('"+str+"', "+idx+", '"+idObj+"', '"+spObj+"', '"+clr1+"', '"+clr2+"', "+delay+" ,"+plysnd+")",delay)}}

function init(){txtTyper(dispStr[0], 0, 'ttl0', 'ttl1', 'red', '#99FF33', 300, 0)}

</script>

javascript的函数本身就限制传入参数的个数。

javascript函数的定义

1：调用关键字function来构造，如：

function distance(x1,x2,y1,y2)

{

var dx=x2-x1

var dy=y2-y1

return Math.sqrt(dx*dx+dy*dy)

}

2：使用Function()构造函数

var f=new Function*"x","y","return x*y")

这行代码创建了一个新函数，该函数和你所熟悉的语法定义的函数基本上时等价的:

function f(x,y)

{

return x*y

}

Functino()构造函数可以接受任意多个字符串参数。它的最后一个参数时函数的主体，其中可以包含任何JavaScript语句，语句之间用分号分隔。其他的参数都是用来说明函数要定义的形式参数名的字符串。如果你定义的函数没有参数，那么可以只需给构造函数传递一个字符串（即函数的主体）即可。

注意，传递给构造函数Function()的参数中没有一个用于说明它要创建的函数名。用Function()构造函数创建的未命名函数有时被成为“匿名函数”。

可能非常想知道Function()构造函数的用途是什么。为什么不能只用function语句来定义所有的函数呢？原因是Function()构造函数允许我们动态地建立和编译一个函数，它不会将我们限制在function语句预编译的函数体中。这样做带来的负面影响效应就是每次调用一个函数时，Function()构造函数都要对它进行编译。因此，在循环体中或者在经常使用的函数中，我们不应该频繁地调用这个构造函数。

使用Function()构造函数的另一个原因是它能够将函数定义为JavaScript表达式的一部分，而不是将其定义一个语句，这种情况下使用它就显得比较的方面，甚至可以说精致。

3：函数直接量

函数直接量是一个表达式，它可以定义匿名函数。函数直接量的语法和function语句非常相似，只不过它被用作表达式，而不是用作语句，而且也无需指定函数名。下面的三行代码分别使用function()语句、Funciont()构造函数和函数直接量定义了三个基本上相同的函数：

function f(x){return x*x}

var f=new Function("x","return x*x")

var f=function(x){reurn x*x}

虽然函数直接量创建的是未命名函数，但是它的语法也规定它可以指定函数名，这在编写调用自身的递归函数时非常有用。例如：

var f=function fact(x){if(x<=1)return 1else return x*fact(x-1)}

上面的代码定义了一个未命名函数，并对它的引用存储在变量f中。它并没有真正的创建一个名为fact()的函数，只是允许函数体用这个名字来引用自身。

函数直接量的用法和用Function()构造函数创建函数的方法非常相似。由于它们都是由JavaScript的表达式创建的，而不是由语句创建的，所以使用它们的方式也就更加灵活，尤其适用于那些只使用一次，而且无需命名的函数。例如，一个使用函数直接量表达式指定的函数可以存储在一个变量中、传递给其他的函数甚至被直接调用：

a[0]=function(x){return x*x}//定义一个函数并保存它

a.sort(function(a,b){return a-b})//定义一个函数；把它传递给另一个函数

var tensquared=(function(x){return x*x})(10)

和Function()构造函数一样，函数直接量创建的是未命名函数，而且不会自动地将这个函数存储在属性中。但是，比起Function()构造函数来说，函数直接量有一个重要的优点。由Function()构造函数创建的函数的主体必须用一个字符串说明，用这种方式来表达一个长而复杂的函数是狠笨拙的。但是函数直接量的主体使用的却是标准的JavaScript语法。而且函数直接量只被解析一次，而作为字符串传递给Function()构造函数的 JavaScript代码则在每次调用构造函数时只需被解析一次和编译一次。

在JavaScript1.1中，可以使用构造函数Function()来定义函数，在JavaScript1.2和其后的版本中，还可以使用函数直接量来构造函数。你应该注意这两种方法之间的重要差别。

首先，构造函数Function()允许在运行时动态地创建和编译JavaScript代码。但是函数直接量却是函数结构的一个静态部分，就像function语句一样。

其次，作为第一个差别的必然结果，每次调用构造函数Function()时都会解析函数体并且创建一个新东汉数对象。如果对构造函数的调用出现在一个循环中，或者出现在一个经常被调用的函数中，这种方法的效率非常低。另一个方面，函数直接量或出现在循环和函数中的嵌套函数不是在每次调用时都被重新编译，而且每当遇到一个函数直接量时也不创建一个新的函数对象。

Function()构造函数和函数之间量之间的第三点差别是，使用构造函数Function()创建的函数不使用词法作用域，相反的，它们总是被当作顶级函数来编译，就像下面代码所说明的那样：

var y="global"

function constructFunction()

{

var y="local"

return new Function("return y")//不捕捉局部作用域。

}

//这行代码将显示"global"，因为Function()构造函数返回的函数并不使用局部作用域。

//假如使用一个函数直接量，这行代码则可能显示"local"。

alert(constructFunction())

<html>

<head>

function getTime() {//js函数，定期执行的函数主体

var dateTime = new Date()//新建系统时间的对象

var hour = formatTime(dateTime.getHours())//获取小时并格式化，格式化函数formatTime()，下同

var minute = formatTime(dateTime.getMinutes())//获取分

var second = formatTime(dateTime.getSeconds())//获取秒

// var millisecond = dateTime.getMilliseconds()//获取毫秒

var code = "当前时间是：" + hour + ":" + minute + ":" + second//+ " " + millisecond//第一个div的内容(数字时钟)

var codeChinese = "当前时间是：" + formatChinese(hour) + "时" + formatChinese(minute) + "分" + formatChinese(second) + "秒"//第二个div的内容(中文时钟)

document.getElementById("divTime").innerHTML = code//第一个div内容填充

document.getElementById("divTimeChinese").innerHTML = codeChinese//第二个div内容填充

document.getElementById("monDigitalClock").innerHTML = makeMonCode(hour.toString() + ":" + minute.toString() + ":" + second.toString()) + blockEmpty()//+ makeMonCode(millisecond.toString())

updateLatestTime()//更新剩余时间

}

function formatTime(num) {//格式化数字，小于10时在数字前添加0

if (num < 10) {

return "0" + num

}

else {

return num

}

function formatChinese(num) {//中文格式处理

var str = String(num)

if (str.length == 1) {//一位数的情况，直接返回中文

return formatSingleNumber(str)

}

else {//两位数的情况

var mid = "十"

var top = str.substr(0, 1)//第一位

var btn = str.substr(1, 2)//第二位

return (formatSingleNumber(top) + mid + formatSingleNumber(btn)).replace("零十", "零").replace("十零", "十").replace("零零", "零").replace("一十", "十")//使用formatSingleNumber函数转换成中文并将不符合中文数字表示方法的替换一下

}

function formatSingleNumber(num) {//单个数字转化成中文

return num.replace("1", "一").replace("2", "二").replace("3", "三").replace("4", "四").replace("5", "五").replace("6", "六").replace("7", "七").replace("8", "八").replace("9", "九").replace("0", "零")

}

setInterval("getTime()", 1000)//定时刷新，每毫秒刷新一次

//模拟时钟代码

function buidlPointArea(num) {//将数字对应的点阵拼接成图案

var code = "<div class='singleNumber'>"

for (var i = 1 i < 6 i++) {

for (var j = 1 j < 5 j++) {

code += createSinglePoint(i + "_" + j, num)

}

code += "</div>"

return code

}

function createSinglePoint(id, num) {//数字对应的黑点

var array0 = new Array("1_1", "1_2", "1_3", "2_1", "2_3", "3_1", "3_3", "4_1", "4_3", "5_1", "5_2", "5_3")//数字0的点阵，下同

var array1 = new Array("1_3", "2_3", "3_3", "4_3", "5_3")

var array2 = new Array("1_1", "1_2", "1_3", "2_3", "3_1", "3_2", "3_3", "4_1", "5_1", "5_2", "5_3")

var array3 = new Array("1_1", "1_2", "1_3", "2_3", "3_1", "3_2", "3_3", "4_3", "5_1", "5_2", "5_3")

var array4 = new Array("1_1", "1_3", "2_1", "2_3", "3_1", "3_2", "3_3", "4_3", "5_3")

var array5 = new Array("1_1", "1_2", "1_3", "2_1", "3_1", "3_2", "3_3", "4_3", "5_1", "5_2", "5_3")

var array6 = new Array("1_1", "1_2", "1_3", "2_1", "3_1", "3_2", "3_3", "4_1", "4_3", "5_1", "5_2", "5_3")

var array7 = new Array("1_1", "1_2", "1_3", "2_3", "3_3", "4_3", "5_3")

var array8 = new Array("1_1", "1_2", "1_3", "2_1", "2_3", "3_1", "3_2", "3_3", "4_1", "4_3", "5_1", "5_2", "5_3")

var array9 = new Array("1_1", "1_2", "1_3", "2_1", "2_3", "3_1", "3_2", "3_3", "4_3", "5_1", "5_2", "5_3")

var numArr = new Array()

numArr[0] = array0

numArr[1] = array1

numArr[2] = array2

numArr[3] = array3

numArr[4] = array4

numArr[5] = array5

numArr[6] = array6

numArr[7] = array7

numArr[8] = array8

numArr[9] = array9

var cls = "whitePoint"

for (var i = 0 i < numArr[num].length i++) {

if (id == numArr[num][i]) {

cls = "blackPoint"

}

return "<div id='" + id + "' class='" + cls + "'></div>"

}

function blockEmpty() {//空格代码

return "<div class='singleNumber'></div>"

}

function blockM() {//冒号的代码

var code = ""

code += "<div class='singleNumber'><div class='whitePoint'></div>"

code += "<div class='whitePoint'></div>"

code += "<div class='blackPoint'></div>"

code += "<div class='whitePoint'></div>"

code += "<div class='blackPoint'></div>"

code += "<div class='whitePoint'></div>"

code += "<div class='whitePoint'></div></div>"

return code

}

function makeMonCode(totalCode) {//生成模拟的数字时钟代码

var finalCode = ""

for (var i = 0 i < totalCode.length i++) {//每个字符分别转换

if (isNaN(totalCode[i])) {//非数字字符，例子中只有冒号

if (totalCode[i] == ":") {

finalCode += blockM()//冒号的代码，用blockM()函数生成

}

else {

finalCode += buidlPointArea(totalCode[i])//数字的代码，用buildPointArea()函数生成

}

return finalCode

}

function updateLatestTime() {//更新剩余时间

var setHour = document.getElementById("sltHour").value//获取选择的小时值

var setMin = document.getElementById("sltMin").value//获取选择的分值

var setSecond = document.getElementById("sltSecond").value//获取选择的秒值

var time = new Date()//获取系统时间

var nowHour = time.getHours()//当前时间小时值

var nowMin = time.getMinutes()//当前时间分值

var nowSecond = time.getSeconds()//当前时间秒值

var viewHour = setHour - nowHour//剩余小时

var viewMin = setMin - nowMin//剩余分钟

var viewSecond = setSecond - nowSecond//剩余秒

if (viewSecond < 0) {//剩余秒小于0时，借位

viewSecond += 60

viewMin -= 1

}

if (viewMin < 0) {//剩余分小于0时，借位

viewMin += 60

viewHour -= 1

}

if (viewHour < 0) {//剩余小时小于0时，借位

viewHour += 24

}

document.getElementById("divLatestTime").innerHTML = "剩余时间为：" + viewHour + "时" + viewMin + "分" + viewSecond + "秒"//填充

if (viewHour == 0 && viewMin == 0 && viewSecond == 0) {//到点提示

alert("到点了！")

}

function createSelect() {//生成选择框代码

var code = ""

code += "请选择闹钟时间：<select id='sltHour' onchange='updateLatestTime()'>"

for (var i = 1 i < 25 i++) {

code += "<option value='" + i + "'>" + i + "</option>"

}

code += "</select>时"

code += "<select id='sltMin' onchange='updateLatestTime()'>"

for (var k = 1 k < 61 k++) {

code += "<option value='" + k + "'>" + k + "</option>"

}

code += "</select>分"

code += "<select id='sltSecond' onchange='updateLatestTime()'>"

for (var j = 1 j < 61 j++) {

code += "<option value='" + j + "'>" + j + "</option>"

}

code += "</select>秒"

document.getElementById("divAlert").innerHTML = code

}

</script>

body {

background-color: #FFFFFF

}

.clsTime {

width: 600px

height: 50px

font-size: 30px

margin-left: auto

margin-right: auto

margin-top: 100px

}

.whitePoint {

width: 10px

height: 10px

background-color: #FFFFFF

margin: 0px

padding: 0px

float: left

}

.blackPoint {

width: 10px

height: 10px

background-color: #000000

margin: 0px

padding: 0px

float: left

}

.clsMonDigitalClock {

margin-left: auto

margin-right: auto

width: 480px

height: 50px

background-color: #FFFFFF

}

.singleNumber {

width: 40px

height: 50px

float: left

font-size: 8px

}

.clsAlert {

width: 400px

margin-top: 50px

margin-left: auto

margin-right: auto

}

.clsLatestTime {

width: 400px

margin-top: 50px

margin-left: auto

margin-right: auto

}

</style>

</head>

<div id="divTime" class="clsTime">loading....</div>

<div id="divTimeChinese" class="clsTime">loading....</div>

</body>

</html>

之前做着玩的，有你说到的功能，有兴趣看看。代码存为html即可。

词库加载错误未能找到文件“E高铁采集器内存溢出ConfigurationDictStopwordstxt”

# 上一篇：苹果手机里面录音怎么导出到电脑

# 下一篇：学习HTML5前端,要会哪些知识点和技能？

推荐阅读

热门文章

最新发布

标签列表

JavaScript怎么写就能让字在网页中一个一个打出来

给您推荐相同类型的内容：