<style>

#div1{width:200px; height:200px; background:red;}

</style>

</head>

<script>

function setColor(color){

	var oDiv=document.getElementById("div1");

	oDiv.style.background=color;

	}

</script>

<body>

<input type="button" value="变绿" onclick="setColor('green')"/>

<input type="button" value="变黄" onclick="setColor('yellow')"/>

<input type="button" value="变黑" onclick="setColor('black')"/>

<div id="div1">

</div>

</body>

　　

<script>

function setStyle(name,value){

	var oDiv=document.getElementById("div1");

	oDiv.style[name]=value;

	}

</script>

<body>

<input type="button" value="变高" onclick="setStyle('height','400px')">

<input type="button" value="变宽" onclick="setStyle('width','400px')">

<input type="button" value="变绿" onclick="setStyle('background','green')">

<div id="div1">

</div>

　　

初探JavaScript魅力的更多相关文章

  1. 【JavaScript从入门到精通】第四课初探JavaScript魅力-04

    第四课初探JavaScript魅力-04 style与className 之前我们已经讲过,style用于在JS里控制元素的样式,通过style可以选中元素的各种css属性.此外,我们也提到过,JS用 ...

  2. 【JavaScript从入门到精通】第三课 初探JavaScript魅力-03

    第三课 初探JavaScript魅力-03 函数传参 上节课的时候我们已经讲了什么是函数,实际上,函数在功能上就类似于css的class一样,将一段代码包裹起来使用.为了让函数的功能更加的丰富和实用, ...

  3. 【JavaScript从入门到精通】第二课 初探JavaScript魅力-02

    第二课 初探JavaScript魅力-02 变量 说起变量,我们不得不提起我们有一部比较古老的电视剧叫<包青天>.包青天有一把非常厉害的宝剑叫“尚方宝剑”,见到尚方宝剑有如见到皇帝.某种程 ...

  4. 【JavaScript从入门到精通】第一课 初探JavaScript魅力-01

    第一课 初探JavaScript魅力-01 JavaScript是什么 如今我们打开一个大型的网站,都会有很多JS效果的功能和应用.对于学过CSS+HTML的同学,即使是像淘宝那样的网站,用一两天时间 ...

  5. 01 - 初探JavaScript魅力

    网页特效原理 用JavaScript修改样式 编写JS的流程 布局:HTML+CSS 属性:确定要修改哪些属性 事件:确定用户做哪些操作(产品设计) 编写JS:在事件中,用JS来修改页面元素的样式 鼠 ...

  6. 初探JavaScript魅力（二）

    行为,样式,结构三者分离(javascript, css, html),不要在行间加行为,样式 样式优先级:*<标签<class<ID<行间 style与className,如 ...

  7. 初探Javascript魅力(1)

    转自:CSDN--http://blog.csdn.net/cherry_vicent/article/details/42120149 1.javascript是什么   根据用户的一些操作,然后来 ...

  8. 初探JavaScript魅力（五）

    JS简易日历    innerHTML <title>无标题文档</title> <script> var neirong=['一','二','三','四','五' ...

  9. 初探JavaScript魅力（四）

    选项卡 <title>无标题文档</title> <style> #div1 .active{background:#FF0;} #div1 div{width:2 ...

  10. 初探JavaScript魅力（三）

    复选框的全选.反选和不选 <title>无标题文档</title> <style> body{background:#666;} </style> &l ...

随机推荐

  1. 局域网iis添加主机头

    局域网上用主机头访问不像外网,直接设置主机头就行了, 在局域网设置了主机头还要修改host文件 打开host快捷的方法: win7在win+r运行里面运行C:\Windows\System32\dri ...

  2. android listen

    android监听机制,应该是一种观察者模式. 摘抄网上教程,观察者模式的结构如下: 其中涉及的角色有: ● 抽象主题(Subject)角色:抽象主题角色把所有对观察者对象的引用保存在一个聚集(比如A ...

  3. webupload-upload执行上传时，进入的路径与linux服务器上的不一致

    将if判断处改为garage即可. 原因是因为if处判断处理没有执行,因为要需要把从garage开始的到后面的字符串都去掉才行 不然:local=http://www.xxx.com/garage s ...

  4. HTML+CSS D09 定位

    1.定位 (1)相对定位 如果对一个元素进行相对定位,它将出现在它所在的位置上.然后,可以通过设置垂直或水平位置,让这个元素“相对于”它的起点进行移动. #box_relative {  positi ...

  5. hibernate在配置文件中配置对象关系映射文件即hbm文件路径的写法

    hbm文件如果在src下,则<mapping resource="*.hbm.xml"/> 如果在实体类包中,则<mapping resource="c ...

  6. java中replace()和replaceAll()区别

    replace和replaceAll是JAVA中常用的替换字符的方法,它们的区别是: 1)replace的参数是char和CharSequence,即可以支持字符的替换,也支持字符串的替换(CharS ...

  7. java基础算法题

    为了提高自己的代码能力和算法能力,我决定每天学习一道算法题,吸收前辈思想. [程序1] TestRabbit.java 题目:古典问题:有一对兔子,从出生后第3个月起每个月都生一对兔子,小兔子长到第三 ...

  8. webstrom官方的活动模版介绍

    编辑模板变量对话框 文件|设置|生活模板--编辑变量Windows和LinuxWebStorm |偏好|生活模板--编辑变量在OS XCtrl + Alt + S 当你点击对话框打开 编辑变量按钮模板 ...

  9. HDU 5804 Price List

    只需和总和比较即可. #pragma comment(linker, "/STACK:1024000000,1024000000") #include<cstdio> ...

  10. 批处理 取得当前路径 %CD%

    在DOS的批处理中,有时候需要知道当前的路径.在DOS中,有两个环境变量可以跟当前路径有关,一个是%cd%, 一个是%~dp0. 这两个变量的用法和代表的内容一般是不同的. 1. %cd% 可以用在批 ...