语法：object.className =classname   (注意大小写)

作用：获取元素的class属性，为网页内的某个元素指定一个CSS样式来更改该元素的外观

示例：

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>className属性</title>
<style>
body{ font-size:16px;}
.one{
border:1px solid #eee;
width:230px;
height:50px;
background:#ccc;
color:red;
}
.two{
border:1px solid #ccc;
width:230px;
height:50px;
background:#9CF;
color:blue;
}
</style>
</head>
<body>
<p id="p1" > 使网页显示动态效果</p>
<input type="button" value="添加样式" onclick="add()"/>
<p id="p2" class="one">实现与用户交互功能</p>
<input type="button" value="更改外观" onclick="modify()"/>

<script type="text/javascript">
function add(){
var p1 = document.getElementById("p1");
p1.className="one";
}
function modify(){
var p2 = document.getElementById("p2");
p2.className="two";
}
</script>
</body>
</html>

JavaScript控制类名（className属性）的更多相关文章

  1. javascript 之 className属性

    Javascript 可以通过className 属性灵活的更改一个标签元素的CSS 类选择器来实现样式的变化. 1.用className 属性修改节点的css类别 代码如下: <html> ...

  2. 控制类名（className 属性）设置或返回class属性

    控制类名(className 属性) className 属性设置或返回元素的class 属性. 语法: object.className = classname 作用: 1.获取元素的class 属 ...

  3. 控制类名（className属性）

    className 属性设置或返回元素的class 属性. 语法: object.className = classname 作用: 1.获取元素的class 属性 2. 为网页内的某个元素指定一个c ...

  4. javascript中ClassName属性的详解与实例

    在javascritp中,我们可以通过style属性可以控制元素的样式,从而实现行为层通过DOM的style属性去干预显示层显示的目标,但是这种方法是不好的,而且为了实现通过DOM脚本设置的样式,你不 ...

  5. (四)学习JavaScript之className属性

    参考:http://www.w3school.com.cn/jsref/prop_classname.asp HTML DOM Anchor 对象 定义和用法 className 属性设置或返回元素的 ...

  6. JavaScript Dom基础-9-Dom查找方法; 设置DOM元素的样式; innerHTML属性的应用; className属性的应用; DOM元素上添加删除获取属性;

    JavaScript Dom基础 学习目标 1.掌握基本的Dom查找方法 domcument.getElementById() Domcument.getElementBy TagName() 2.掌 ...

  7. [转] JavaScript控制浏览器全屏及各种浏览器全屏模式的方法、属性和事件

    [From] http://www.jb51.net/article/76695.htm HTML 5中的full screen,目前可以在除IE和opera外的浏览器中使用 ,有的时候用来做全屏AP ...

  8. JavaScript--控制类名（className 属性）

    className 属性设置或返回元素的class 属性. 语法: object.className = classname 作用: 1.获取元素的class 属性 2. 为网页内的某个元素指定一个c ...

  9. JS之ClassName属性使用

    一.style与className属性的对比 在前面的style属性学习中,知道了通过style属性可以控制元素的样式,从而实现了行为层通过DOM的style属性去干预变现层显示的目地,但是这种就是不 ...

随机推荐

  1. spring-boot 之 使用Admin监控应用

    https://yq.aliyun.com/articles/2322 ************************************* 摘要: Spring Boot提供的监控接口,例如: ...

  2. asp 使用TreeView控件

    这段代码为了使用 TreeNodeCheckChanged 事件,会有回刷新的效果: 不喜欢的可查看改进版,利用js控制选择操作,无界面刷新, “http://www.cnblogs.com/GoCi ...

  3. C# 拆箱与装箱 要严格控制,数量多起来严重影响效率

    int i = 5; object o = i; int j = (int)o; IComparer x = 5; 1. o的对象必须为一个引用,而数字5不是,则发生了装箱: 运行时将在堆上创建一个包 ...

  4. Failed: error processing document #281: unexpected EOF，往MongoDB当中插入json文件时出现的错误。

    往MongoDB当中插入json文件时提示的错误(我的操作系统是win10): 当时的执行命令是:mongoimport -d test -c restaurants d://primer-datas ...

  5. JS在window和document的应用

    页面跳转: window.location.href('地址') window.open('地址', '_self') 打开新窗口: window.open('地址', '_blank') 只显示地址 ...

  6. linux 记录用户操作记录日志

    ####################################################################################historyUSER_IP=$ ...

  7. arguments.callee的用法

    argument为函数内部对象,包含传入函数的所有参数,arguments.callee代表函数名,多用于递归调用,防止函数执行与函数名紧紧耦合的现象,对于没有函数名的匿名函数也非常起作用.举例如下: ...

  8. Mysql 拼接字段查询语句和join查询拼接和时间查询

    个人平时记录的,有点乱 1.修改时间字段,如果时间字段的类型是date或者是datetime类型的 update 表名 set 时间字段 = DATE_FORMAT(NOW(),'%Y-%m-%d % ...

  9. Java EE : 一、图解Http协议

    目录 Java EE : 一.图解Http协议 Java EE : 二.图解 Cookie(小甜饼) Java EE : 三.图解Session(会话) 概述 一.技术基石及概述 二.深入理解技术基石 ...

  10. mybatis高级(1)(入门回顾)

    首先入门案例(并且拿到新增记录当前id) 1.创建mybatis-config.xml文件 <?xml version="1.0" encoding="UTF-8& ...