语法: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. Js dom操作总结

    1.选取文档元素 1.1. getElemenById 基于唯一id获取,任何HTML元素可以有id属性,在文档中该值必须唯一. 1.2. getElementsByName 基于name属性的值选取 ...

  2. 准循环LDPC码用于公钥密码时的奇偶校验矩阵

    设H为奇偶校验矩阵,其行权重为d.Q为转置矩阵,其行权重为m.对于LDPC码,有d/n<< 1, m/n< 1. H´=H·QT是用于公钥密码的奇偶校验矩阵.它不是老密码G的奇偶校验 ...

  3. C# 发送qq邮箱

    注意: QQ邮箱的简单邮件传输协议(SMTP)使用了SSL加密,必须启用SSL加密.指定端口. QQ邮箱POP3/SMTP服务默认是关闭的,需要开启服务(设置=>账户=>开启服务). QQ ...

  4. Nginx的第一个模块-HelloWorld

    麻雀虽小,五脏俱全,小小的Hello World盛行于程序世界,就在于其代码虽短,但要真正运行起来,需要我们略通基本语法,稍懂编译运行环境,知晓操作过程,最后,还有一颗持之以恒,不怕折腾的心.前一阵子 ...

  5. eclipse不显示Android SDK Manager标签

    新版的eclipse配置好android开发环境后没有显示在window菜单里显示Android SDK Manager,也没有在工具栏里出现android的工具图标.但可以通过android sdk ...

  6. python SimpleHTTPRequestHandler初探

    1,转自 https://blog.gtwang.org/web-development/python-simplehttpserver-web-server/ 如果你急需一个简单的Web Serve ...

  7. Eclipse中全局搜索和更替

    Eclipse全局搜索步骤  使用快捷键"ctrl+H"打开文件搜索对话框,选择"File Search"标签,在Containing text中输入你需要搜索 ...

  8. 使用scrapy创建工程

    前提:先创建一个文件夹用来存放爬虫工程 创建项目命令: scrapy startproject <project_name> 例子: scrapy startproject myproje ...

  9. IIS发布网站出现“未能加载文件或程序集“System.Data.SQLite”或它的某一个依赖项。”的解决方法

    未能加载文件或程序集“System.Data.SQLite”或它的某一个依赖项.试图加载格式不正确的程序.              说明: 执行当前 Web 请求期间,出现未经处理的异常.请检查堆栈 ...

  10. 解决xftp远程连接中文乱码

    更改乱码服务器的属性,使用UTF-8编码