javascirpt 特效编程
本帖最后由 rain 于 2014-10-18 00:41 编辑先来个最基础的js入门程序，往后就省略开头，直接写中间部分内容。
<script type="text/javascript">
document.write("Hellow World !");
</script>
一、自动刷新页面
方法一：<meta http-equiv="refresh" content="20"> 每20秒刷新一次
方法二：用js写
<script type="text/javascript">
function fresh(){
window.location.reload();
}
setTimeout('fresh()',20000); //自动刷新定时器
</script>
//reload()函数的作用是让浏览器刷新当前网页。
本帖最后由 rain 于 2014-10-17 16:13 编辑
二、写个让页面前进和后退的按钮
1、js部分
//前进
function goForward(){window.history.forward();}
//后退
function goBack(){window.history.back();}
2、网页部分写好按钮
<input type="button" value="前进"onclick="goForward()"/>
<input type="button" value="后退"/>
效果
ps：history 对象里，还有一个go()函数，用正负值表示，例如go(1)表示前进一页。 本帖最后由 rain 于 2014-10-17 21:41 编辑
三、关闭页面按钮
1、js
functioncloseWin(){window.close();}
2、css
<input type="button" value="关闭窗口" onclick=closeWin()/> //onclick 动作省去了“”，防止代码干扰:(
单击按钮，则该页面关闭 本帖最后由 rain 于 2014-10-18 02:31 编辑
四、页面载入等待界面
1、js
function submitForm(){
var doing = document.getElementById('doing'); //获取界面的dom
doing.style.display=' '; //取消隐藏
self.location.reload(); // 重新刷新页面
｝
2、css
<div id="doing" style="z-index:99; left:0px;top:0px;display:none; width:100%; position:absolute;height:100%;background:#ccc;">
载入中，请等待。。。。
</div>
<p>
<input type="button" value="提交表单" />
</p>
点击按钮时出现等待提示，提交完成后恢复页面 五、若干秒后不操作自动关闭窗口
var willClose = true; //定义一个是否关闭的全局变量
function clickBody(){
willClose = false; //单击网页后，把变量置为false
}
setInterval ( function() {
if (willClose){
window.close(); //关闭窗口
}else{
willClose = true ;
}
},10000); // 10秒后才执行该函数
setInterval() 用来记时和进行重复操作。本例中是10秒后执行第一个参数。
六、修改网页标题
1、js
function changeTitle(){
var newTitle=document.getElementById('newTitle').value; //得到新的Title值
document.title=newTitle; //修改标题
}
2、css
<input type="text" name="newTitle" id="newTitle" value="" />
<input type="button" value="修改标题" />
在这里输入内容，点击按钮，则页面标题就改掉了 本帖最后由 rain 于 2014-10-18 04:04 编辑
七、禁止网页放入框架
防止网页被随意地引入到别人的框架里。
if(self != top){ //判断当前页是否为最顶层框架的网页
top.location.href=self.location.href; //如果不是，则进行跳转
}
top和self是否等同，可以作为网页是否在一个框架中打开的判断标准。 本帖最后由 rain 于 2014-10-18 04:04 编辑
八、跳转到其它页面
function changURL(){
var newURL = document.getElementById('newURL').value; //得到新的url值
self.location.href=newURL; //通过修改地址栏的地址来跳转到新的网页地址
下面写个输入组件就可以了
如果网页处于一个框架当中，那么这样的跳转仅限于框架里，而不是整个窗口。如果整个窗口跳转，应把self换成window。 九、进入页面时的问候
alert('欢迎您的光临'); //弹出对用户的问候
可以放在</html>后边 十、在网页里动态加载javascript
functionloadJs(){
vartheHead = document.getElementsByTagName('head').item(0); //得到html的头部dom
varmyScript = document.createElement('script'); //创建脚本的dom对象实例
myScript.src='./myjs.js'; //指定脚本路径
myScript.type='text/javascript'; //指定脚本类型
myScript.defer=true; //程序下载完后再解析和执行
theHead.appendChild(myScript); //把dom挂载到头部
｝
定义按钮
<input type="button" value="动态加载JS"onclick=loadJS() />:(
页:
[1]
2