`
cs_man
  • 浏览: 57369 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

用javascript动态设置对象的class的通用方法

阅读更多
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title> 改变对象的样式class</title>
<style>
.c1{font-size:15px; color:blue; font-weight:bold}
.c2{font-size:18px; color:red; font-weight:bold; background-color:yellow;}
</style>
</head>
<script language="javascript">
function initClass()
{
var d=document.getElementById("d1");
d.className="c1";
}

function changeClass()
{
var d=document.getElementById("d1");
d.className="c2";
}

function setClass(obj_id,_class)
{
var obj=document.getElementById(obj_id);
obj.setAttribute("class",_class);// 此句可无
obj.setAttribute("className",_class);
}
</script>
<body>
<div id="d1">
我是中国人
</div>
<p><br>
<br>
<input type="button" value=" 改变class" name="c1" onclick="initClass()">
  
<input type="button" value=" 继续改变class" name="c1" onclick="changeClass()">
  
<input type="button" value=" 标准设置" name="c1" onclick="setClass('d1','c1')">
</p>

</body>
</html>
分享到:
评论

相关推荐

    objects.js:使用Javascript进行高性能游戏的核心类工具和对象池

    面向对象-最好的javascript类系统(感谢Prototype和class.js / Javascript MVC),并进行了一些调整。 池化-垃圾回收对于高性能应用程序来说是一个痛苦,因此,我们不是零星地实现它,而是构建了一种轻松地池化...

    prototype.js开发笔记--让你精通prototype开发

    1.3. 通用性方法 1.3.1. 使用 $()方法 1.3.2. 使用$F()方法 1.3.3. 使用$A()方法 1.3.4. 使用$H()方法 1.3.5. 使用$R()方法 1.3.6. 使用Try.these()方法 1.4. Ajax 对象 1.4.1. 使用 Ajax.Request类 1.4.2. 使用 ...

    cox-tagwire:TagWire是一个Javascript库,可以帮助您在Javascript对象和HTML标签之间进行数据绑定

    _ :这是区分通用类和TagWire的分隔符。 {variable name} :要使用的值的变量名。 - :用于分隔变量名和函数名的分隔符。 {tail function} :使用数据的属性或用户定义的函数。 它被称为尾部功能。 附加信息 ...

    C#实现JavaScript帮助类

    使用帮助类可以极大地简化开发过程,尤其是在处理复杂的功能或涉及多个对象之间的交互时。例如,一个日期帮助类可以提供各种日期计算和格式化的方法,一个字符串帮助类可以提供字符串处理和转换的方法,等等。

    JavaScript Table行定位效果

    首先想到的方法是给tr设置relative,用ie6/7测试以下代码: Code &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; ; left:100px...

    jquery插件使用方法大全

    ·更容易使用的设置函数(setter function):为所有对象新增了许多易用的设置函数; ·对Ajax的改进:引入了许多Ajax和JSON处理方面的更新,包括HTML5元素的序列化; ·attribute(改进了.attr()的性能)、jQuery...

    Prototype学习笔记(最新整理)

    通用性方法 3 2.1. 使用 $()方法 3 2.2. 使用$F()方法 4 2.3. 使用Try.these()方法 5 3. Ajax 对象 5 3.1. 使用 Ajax.Request类 5 3.2. 使用 Ajax.Updater 类 7 4. prototype.js参考 9 4.1...

    v2-极简的高性能2D矢量类-JavaScript开发

    v2-简约的2D矢量类v2并不是真正的类,而只是一个生成器函数,可生成普通的javascript对象。...与基于类的向量库相比,这里的优势是更通用的方法,这种方法似乎也可以与碰巧拥有x和y成员的其他对象一起使用。 VA

    flex3的cookbook书籍完整版dpf(包含目录)

    16.8.节使用ActionScript动态添加和去除图表中的列 16.9.节重叠多个图表 16.10.节拖曳图表中的项目 16.11.节创建一个可以编辑线状图 第十七章. 共享对象(557) 17.1节. 创建一个共享对象 17.2节. 写入数据到共享...

    hermes-class:一种憎恶恐惧的方法来定义与Hermes兼容的类

    爱马仕级 启发方法定义了兼容类。 import Class from 'hermes-class' ; const MySet = Class ( { static : { name : 'MySet' } , ...使用基于对象文字的ES6友好API创建通用类或扩展本机类。 避免不希望的移

    asp.net知识库

    动态调用对象的属性和方法——性能和灵活性兼备的方法 消除由try/catch语句带来的warning 微软的应试题完整版(附答案) 一个时间转换的问题,顺便谈谈搜索技巧 .net中的正则表达式使用高级技巧 (一) C#静态成员和...

    class-inspector

    班级检查员您的挑战反射是面向对象语言中的通用工具,用于检查类并派生有关其公开的属性/方法以及它们继承的其他类的信息。 今天我们将编写我们自己JavaScript反射器! 我们将编写一个简单的实用程序,该实用程序将...

    -caliatys-array-typer:创建泛型类型对象的数组或字典

    一个Node.js模块,可从Object数组创建通用类型对象的数组或字典 安装 npm install @caliatys/array-typer --save 用法 Java脚本 设置示例 // Let's create our own object type let MyObject = /** @class */ ( ...

    您只需编写一次即可在任何地方使用的Universal Vue商店-JavaScript开发

    您只需编写一次并可以在任何地方使用的Vue通用存储Vue类商店只需编写一次并可以在任何地方使用的V摘要,所以Vue,Vuex和Vue Class Store走进了酒吧……Vue说:“我给您提供React性和计算属性和手表,但只能在组件中...

    redefine:用于智能对象属性定义的轻量级实用程序

    如果您可以在这里将属性懒惰地分配给通用对象或原型,请检查 。 关于重新定义JS 这个约1.5KB(最小化并压缩)的框架在node.js和所有现代移动或桌面浏览器中带来了ES5和ES6功能的强大功能。 主要特点: ES6喜欢类...

    JAVA上百实例源码以及开源项目源代码

    得到RSA密钥对,产生Signature对象,对用私钥对信息(info)签名,用指定算法产生签名对象,用私钥初始化签名对象,将待签名的数据传送给签名对象(须在初始化之后),用公钥验证签名结果,使用公钥初始化签名对象,用于...

    commons-lang3-3.1 API

    Commons Lang这一组API也是提供一些基础的、通用的操作和处理,如自动生成toString()的结果、自动实现hashCode()和equals()方法、数组操作、枚举、日期和时间的处理等等。 这一组API的所有包名都以org.apache....

    penrose:Penrose平铺的p5.js实现

    HalfKite和HalfDart对象每个都有一个细分方法,该方法可根据下图构造新的HalfKite和HalfDarts。 构造逻辑与p5渲染逻辑完全分开,因此相同的通用类结构可以与任何渲染库一起使用。 class HalfKite { constru

    JSTL JSP 自定义标签 分页

    jh-plugins是一项基于...${PageModel对象}" pageStep="5" javaScript="" styleClass="" viewURL=""/&gt; 祝您使用愉快,谢谢! 作者:Hardy(admin@xkshow.cn) 项目开源地址:http://code.google.com/p/jh-plugins/

Global site tag (gtag.js) - Google Analytics