JavaScript太强大了，虽然是弱语言，不过一点都不输于Java

可以自行设置随机数，来动态更改CSS样式，每一次都是不一样的感觉，这个小功能挺实用的

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>JavaScript修改DOM节点CSS样式</title>

<script type="text/javascript">

	var flag = 0;

	function modifyDOMCSS(){

	if(flag==0){

		document.getElementById("who").style.color="red";

		/* alert(flag); */

		flag = 1;

		}

	else if(flag == 1) {

			document.getElementById("who").style.color = "blue";

			/* alert(flag); */

			flag = 0;

		}

	}

</script>

</head>

<body>

<p id="who">fuck you</p>

<input type="button" value="Update color" onclick="modifyDOMCSS()"/>

</body>

</html>

JavaScript--动态更改CSS样式的更多相关文章

  1. 使用JavaScript动态更改CSS样式

    在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几种方式动态的修改样式,下面将介绍方法的使用.效果.以及缺陷. 1.使用obj.className来修改样式表的类名. ...

  2. javascript 动态修改css样式方法汇总(四种方法)

    在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几种方式动态的修改样式,下面将介绍方法的使用.效果.以及缺陷. 1.使用obj.className来修改样式表的类名. ...

  3. javascript 动态修改css样式

    方法一:改变外联css文件,这里不讲这个. 方法二:通过改变claaName来改变样式,语法: obj.className = "style2"; //或者 obj.setAttr ...

  4. 【javascript】原生js更改css样式的两种方式

    下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3  &quo ...

  5. 原生js更改css样式的两种方式

    下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3  &quo ...

  6. ASP.NET中直接用C# 动态修改CSS样式

    ASP.NET中直接用C# 动态修改CSS样式  wonsoft (wonsoft@163.com) 使用JavaScript控制CSS样式有点麻烦,还是觉得直接使用C#操作更方便快捷,本文通过两个B ...

  7. JavaScript 动态插入 CSS

    写组件时有时想把一些组件特性相关的 CSS 样式封装在 JS 里,这样更内聚,改起来方便.JS 动态插入 CSS 两个步骤就可以 创建一个 style 对象 使用 stylesheet 的 inser ...

  8. JavaScript动态修改CSS

    链接:https://www.cnblogs.com/aademeng/articles/6279060.html 在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几 ...

  9. Javascript动态引用CSS文件的2种方法介绍

    最近做一个项目,需要javascript动态插入样式,结果以前的方法失效了!查了2个小时的原因竟然是自己手贱,这个最后再说! javascript插入样式在前端开发中应用比较广泛,特别是在修改前端表现 ...

随机推荐

  1. __block存储类型

    __block存储类型 你可以指定引入一个变量为可更改的,即读-写的,通过应用__block 存储类型修饰符.局部变量的__block 的存储和 register.auto.static 等存储类型相 ...

  2. ASP.NET MVC轻教程 Step By Step 3 ——使用ViewBag

    在上一节我们创建了与Index动作方法对应的Index视图,那么Index动作方法该如何向Index视图传送数据呢?其中一个方法是使用ViewBag(视图包).让我们试试看. 在Index动作方法中添 ...

  3. 批处理WMIC查看补丁情况

    最近补丁比较多,需要看系统打了些啥,哪些没打的BAT: wmic qfe GET hotfixid > a.txt&(for %i in (KB3076321 KB3072604 KB3 ...

  4. Struts2的声明式异常处理

    在struts2应用程序中你还在使用try catch语句来捕获异常么?如果是这样的,那你OUT啦!struts2支持声明式异常处理,可以再Action中直接抛出异常而交给struts2来 处理,当然 ...

  5. Sublime Text 有哪些使用技巧

    1. 更改变量名的几种方法&lt;img src="https://pic4.zhimg.com/d93cf0e8987e0117f3a3187cfe8e53fb_b.jpg&quo ...

  6. form.Show()和form.ShowDialog()的区别、新建一个form和MessageBox.Show()的常见用法

    一:form.Show()和form.ShowDialog()的区别 a. 任何窗体(派生于基类Form的类),都可以以两种方式进行显示. //非模式窗体From qform=new Form();q ...

  7. Rectangle Area——LeetCode

    Find the total area covered by two rectilinear rectangles in a 2D plane. Each rectangle is defined b ...

  8. zoj 3365 灵活数字规律

    题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3365 #include <cstdio> #incl ...

  9. python操作RabbiMQ

    RabbitMQ是一个在AMQP基础上完整的,可复用的企业消息系统.他遵循Mozilla Public License开源协议. MQ全称为Message Queue, 消息队列(MQ)是一种应用程序 ...

  10. VS2008 error C2470

    error C2470: '***类' : looks like a function definition, but there is no parameter list; skipping app ...