通过js 点击按钮去改变目标原始的背景颜色

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <title>Change.html</title>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

  <script language="javascript">

     function test4(event) {

	   if(event.value == "11") {

	      //?取div1

	      var div1 = document.getElementById('div1');

	      div1.style.backgroundColor="black";

	   }

	   if(event.value == "22") {

	      //?取div1

	      var div1 = document.getElementById('div1');

	      div1.style.backgroundColor="red";

	   }

	 }

  </script>

</head>

<body>

  <div id="div1" style="width:400px; height:300px; background-color:red;">div1</div>

  <input type="button" value="11" onclick="test4(this)"/>

  <input type="button" value="22" onclick="test4(this)"/>

  </body>

</html>

Js 通过点击改变css样式的更多相关文章

  1. js改变css样式

      CreateTime--2017年10月31日15:14:12 Author:Marydon js改变css样式 1.js改变单个css样式 HTML部分 <div id="tes ...

  2. jQuery中添加/改变/移除改变CSS样式例子

    在jquery中对于div样式操作我们会使用到CSS() removeClass() addClass()方法来操作了,下面我们就整理了几个例子大家一起来看看吧.     CSS()方法改变CSS样式 ...

  3. 8 HTML DOM 元素的查找与改变&改变CSS样式&HTML事件

    HTML DOM(Document Object Model)文档对象模型 当网页被加载时,浏览器会创建页面的文档对象模型. HTMLDOM 定义了用于HTML的一系列标准的对象.通过DOM,你可以访 ...

  4. jQuery基础 - 改变CSS样式

    jQuery提供css()的方法来实现嵌入式改变元素样式,css()方法在使用上具有多样性.其中一种接受两个输入参数:样式属性和样式值,它们之间用逗号分开.比如我们要改变链接颜色,我们可以使用下面的代 ...

  5. 改变CSS样式

    改变CSS样式 1.改变HTML元素样式的语法 //改变HTML样式的语法 document.getElementById(id).style.property = new style 例子: < ...

  6. JQuery - 改变css样式

    jQuery提供css()的方法来实现嵌入式改变元素样式,css()方法在使用上具有多样性.其中一种接受两个输入参数:样式属性和样式值,它们之间用逗号分开.比如我们要改变链接颜色,我们可以使用下面的代 ...

  7. jQuery CSS()方法改变CSS样式实例解析

    转自:http://www.jbxue.com/article/24588.html 分享一个jQuery入门实例:使用CSS()方法改变现有的CSS样式表,css()方法在使用上具有多样性.其中有一 ...

  8. javascript之DOM编程改变CSS样式（简易验证码显示）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 巧用hover改变css样式和背景

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. Servlet常用类

    javax.servlet.ServletConfig;javax.servlet.ServletException;javax.servlet.http.HttpServlet;javax.serv ...

  2. Node.js事件循环

    Node JS是单线程应用程序,但它通过事件和回调概念,支持并发. 由于Node JS每一个API是异步的,作为一个单独的线程,它使用异步函数调用,以保持并发性.Node JS使用观察者模式.Node ...

  3. 【Java】String,StringBuffer与StringBuilder的区别??

    String 字符串常量StringBuffer 字符串变量(线程安全)StringBuilder 字符串变量(非线程安全) 简要的说, String 类型和 StringBuffer 类型的主要性能 ...

  4. 普通table表格样式及代码大全(全)

    普通table表格样式及代码大全(全)(一) 单实线边框表格 <TABLE style="BORDER-COLLAPSE: collapse" borderColor=#00 ...

  5. Mysql 数字类型转换函数

    .将Int 转为varchar经常用 concat函数,比如concat(,' .将varchar 转为Int 用 cast(a as signed) a为varchar类型的字符串 总结:类型转换和 ...

  6. 解决VS2010中产生的ipch文件夹和sdf文件

    纯粹参考他人博文,转载时注明参考链接!!! 参考链接: http://blog.sina.com.cn/s/blog_707a4cbf0100r5jq.html 在VS2010开发的项目中,ipch文 ...

  7. Pen Editor

    Pen Editor

  8. Hierarchy Viewer显示视图性能指标

    Hierarchy Viewer默认打开“Tree View”窗口无法显示显示Performance indicators: 但选中根视图再点击按钮“Obtain layout times for t ...

  9. C语言数据类型的理解

    数据类型的定义: 作为一种语言,必然有所谓的语言组成要素,就像日常生活中人们之间的交流一样,首先会有字,字再成词组,再来就是句子,后来呢就是段落等等.当然不同的字,词,句这些在一起,就会有不同的表达效 ...

  10. MD5加密详解

    MD5加密详解 引言: 我在百度百科上查找到了关于MD5的介绍,我从中摘要一些重要信息: Message Digest Algorithm MD5(中文名为信息摘要算法第五版)为计算机安全领域广泛使用 ...