原文发布时间为:2008-11-10 —— 来源于本人的百度文章 [由搬家工具导入]

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>js</title>
<style>
.level1 {
font-style: normal;
font-weight: bold;
font-variant: normal;
color: #00FF99;
background-color: #FF0000;
text-decoration: underline;
}
</style>
<script type="text/javascript">
function csschange(){
var c1=document.getElementById("p1");
c1.style.fontStyle="italic";
c1.style.fontWeight="normal";
c1.style.fontVariant="normal";
c1.style.color="blue";
c1.style.backgroundColor="green";
c1.style.textDecoration="blink";
}

function bytag(){
var c2=document.getElementsByTagName("p");
c2[0].style.fontStyle="italic";
c2[0].style.fontWeight="normal";
c2[0].style.fontVariant="normal";
c2[0].style.color="red";
c2[0].style.backgroundColor="yellow";
c2[0].style.textDecoration="blink";
c2[1].style.backgroundColor="yellow";
}

   var position=new Array();
   position[0]=200;position[1]=150;
   position[2]=300;position[3]=150;
   position[4]=300;position[5]=300;
   position[6]=200;position[7]=300;
   var i=0;
function run(){
var m=document.getElementById("move");
m.style.left=position[i];
m.style.top=position[i+1];
i+=2;
if(i==8)
     i=0;
}
function checkbrowser(){
   if(!document.getElementById)
       alert('浏览器不支持此程序');
   else if(!document.all){
       alert('浏览器不支持此程序');
    document.location.href="http://www.baidu.com";
    }
    }
</script>
</head>

<body onload="checkbrowser();runing=setInterval('run();',100);">

<p class="level1" id="p1">改变你</p>
<p>&nbsp; </p>
<form id="form1" name="form1" method="post" action="">
<label>
<input name="change" type="button" id="change" value="按钮ByID" onclick="csschange();" />
</label>
<label>
<input name="tag1" type="button" id="tag1" value="按钮ByTag" onclick="bytag();" />
</label>
</form>
<span style="position:absolute;left:200px;top:300px;" id="move">
<img src="../../图片/视觉/image016.jpg" width="100" height="100"/>
</span>
<input name="Stop" type="button" id="stop" onclick="clearInterval(runing);" value="Stop" />
</body>
</html>

1、JavaScript引用Css属性时,若有连接符,须去掉连接符,并把连接符后面的单词的第一个字符大写,如css属性background-color,引用时需写成backgroundColor。

2、getElementsByTagName是数组,getElementById是唯一一个

3、JavaScript引用属性时一般是document.getElementById("objectId").style.属性

4、用if(!document.getElementById)可以判断该浏览器是不是W3C标准,用 else if(!document.all)可以判断是不是旧版本的IE浏览器

最新文章

  1. 解决maven生成的web项目下的servlet.jar与tomcat自带servlet.jar冲突的问题
  2. Lucene.net站内搜索—1、SEO优化
  3. Oracle 游标使用全解(转)
  4. LazyLoad使用注意
  5. SPOJ - DQUERY 主席树
  6. 解决maven官方库中没有oracle jdbc驱动的问题:Missing artifact com.oracle:ojdbc14:jar:10.2.0.1.0
  7. ArcGIS Desktop 与 Excel(转)
  8. Ubuntu Server 14.04 下root无法ssh登陆
  9. android怎样实现自动点击功能
  10. C# 开发技巧]如何防止程序多次运行 线程 进程
  11. work2:贪吃蛇
  12. 读书笔记_Effective_C++_条款三:尽可能使用const
  13. File &quot;/usr/bin/yum&quot;, line 30 except KeyboardInterrupt, e:
  14. Linux常用基本命令(rename,basename,dirname)
  15. 原来zabbix监控进程与端口是如此的简单!
  16. Alpha阶段博客链接
  17. 深度学习 循环神经网络 LSTM 示例
  18. 3.5 面向连接的运输:TCP
  19. 2018.1.9 博客迁移至csdn
  20. jQuery多项选项卡的实现

热门文章

  1. web前端怎么样才能入门
  2. HashMap,Hashset,ArrayList以及LinkedList集合的区别,以及各自的用法
  3. 复位电路设计&mdash;&mdash;利用PLL锁定信号(lock)产生复位信号
  4. HttpServletResponse 的状态码
  5. gulp自动化构建工具使用
  6. PHP环境搭建Zend Studio 10.6.2+WampServer2.4
  7. 指针-AC自动机
  8. 搜索 || BFS || POJ 2157 Maze
  9. JS常用字符串处理方法应用总结
  10. IOS学习笔记1—Iphone程序运行流程