发布于 2017-01-10 07:17:21 | 162 次阅读 | 评论: 0 | 来源: 网友投递

这里有新鲜出炉的Javascript教程,程序狗速度看过来!

JavaScript客户端脚本语言

Javascript 是一种由Netscape的LiveScript发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。


现在纯粹用js的人越来越少了,更多的人喜欢jquery,可使我还是喜欢javascript,下面给出一个用javascript写的背景切换的小例子,各位大虾不要骂,只是写给自己看的,也供js事件的产考依据。
html代码
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>背景切换</title> 
<link href="css/bgchage.css" type="text/css" rel="Stylesheet" /> 
</head> 
<body> 
<div><ul><li></li><li></li><li></li><li></li></ul></div> 
<!-- <div>1</div><div>2</div><div>3</div><div>4</div>--> 
</body> 
<script src="js/bgchage.js" type="text/javascript" ></script> 
</html> 

因为javascript逻辑顺序比较强,所以要考虑引用js的位置
css代码
 
body {font-size:12px;} 
div{ width:950px; height:800px; margin:0 auto; border:solid 1px #d0d0d0;} 
li{ list-style-type:none;border:solid 1px #d0d0d0; float:left; margin: 1px; padding:0 5px; height:12px; width:10px;} 
/*div{ width:6px; height:14px; margin:1px; padding:0 5px; float:left; border:solid 1px #d0d0d0;}*/ 

javascript代码部分:
 
window.onload=init; 
var element= document.getElementsByTagName("li"); 
function init() //初始化背景色 
{ 
var element= document.getElementsByTagName("li"); 
for(var i=0; i<4;i++) 
{ 
var k=i+1; 
element[i].style.background="url(images/"+k.toString()+".jpg)"; 
} 
} 
function addclick() 
{ 
for(var i=0; i<4;i++) 
{ 
var k=i+1; 
if(window.attachEvent) 
element[i].attachEvent("onclick", new Function("bgchage("+k+");")); //创建事件不能直接.onclick而需要使用.attachEvent("事件",new Function("被调函数("+参数+");"));IE6通过 
else 
element[i].addEventListener("click", new Function("bgchage("+k+");"),false); 
} 
} 
function bgchage(t) //根据色块改变背景色 
{ 
document.getElementsByTagName("body")[0].style.background="url(images/"+t+".jpg)"; 
} 
addclick(); 

js部分要注意写事件的兼容,而且其实jq的思路就是将很多功能写成插件的形式供自己使用,用javascript写,可以写自己的类库,供反复使用,也无需承担jquery类库的负担。其实我也不是说jquery不好,从大的方面来说,jquery的插件大小影响并不大,前端事件看了百度前端交流会的视频,发现人家的类库也都是js自己写的,这给了我继续学习js的动力。

最新网友评论  共有(0)条评论 发布评论 返回顶部

Copyright © 2007-2017 PHPERZ.COM All Rights Reserved   冀ICP备14009818号  版权声明  广告服务