DOM對象實現的標題欄跑馬燈文字滾動效果，這裏是取自title標籤內的文字來實現跑馬燈效果，只是爲了演示Dom對象的用法。在示例中，可控制文字向左滾動、向右滾動，爲了便於理解，代碼中已給出完整的註釋，相信是研究DOM操作的一個好例子。
<html>
<head>
<title>Dom跑馬燈效果</title>
<script type="text/javascript" language="javascript">
var timeId = "";
//默認跑馬燈效果
function run() {
var title = document.title;
var firsttitle = title.charAt(0);
var remaintitle = title.substring(1, title.length);
document.title = remaintitle + firsttitle;
}
//左轉，字符串拼接
function leftrun() {
var title = document.title;
var firsttitle = title.charAt(0);
var remaintitle = title.substring(1, title.length);
document.title = remaintitle + firsttitle;
}
//右轉，字符串拼接
function rightrun() {
var title = document.title;
var righttitle = title.substring(title.length - 1, title.length);
var remaintitle = title.substring(0, title.length - 1);
document.title = righttitle + remaintitle;
}
//定義變量記錄開啓的計時器
var leftclearId;
var rightclearId;
//左滾方法
function leftsetInter() {
//定義變量記錄當前開啓的計時器ID
leftclearId = setInterval('leftrun()', 500);
//清除正在運行的計時器
clearInterval(rightclearId);
}
//右滾方法
function rightsetInter() {
//定義變量記錄當前開啓的計時器ID
rightclearId = setInterval('rightrun()', 500);
//清除正在運行的計時器
clearInterval(leftclearId);
}
</script>
</head>
<body>
<input type="button" value="跑馬燈效果" onclick="timeId=setInterval('run()',500)"/>
<input type="button" value="停止" onclick="clearInterval(timeId)"/><br/><br/><br/>
<input type="button" value="向左滾動" onclick="leftsetInter()"/>
<input type="button" value="向右滾動" onclick="rightsetInter()"/>
</body>
</html>