CSS样式的引用有3种方式:style引用、class引用、id引用,所以js改变元素的样式我们也分3种来说。

1.js改变由style方式引用的样式:
方法一:document.divs.style.cssText="border:1px solid #000000;color:#FF0000";
方法二:document.divs.setAttribute("style","border:1px solid #000000;color:#FF0000");

其中,divs是要改变样式元素的name。

2.js改变由class方式引用的样式:
方法一:document.divs.className='divs1';
方法二:document.divs.setAttribute("class","divs1");

其中,divs是要改变样式元素的name。

3.js改变由id方式引用的样式:
方法二:document.divs.setAttribute("id","divs1");

其中,divs是要改变样式元素的name。

例子:

function expand(el)
{
childobj = document.getElementById("child" + el);

if (childobj.style.display == 'none')
{
childobj.style.display = 'block';
}
else
{
childobj.style.display = 'none';
}
return;
}

用JS改变的元素CSS样式,css里display :none 隐藏 block 显示的更多相关文章

  1. Ajax编程中,经常要能动态的改变界面元素的样式

    在Ajax编程中,经常要能动态的改变界面元素的样式,可以通过对象的style属性来改变,比如要改变背景色为红色,可以这样写:element.style.backgroundColor=”#ff0000 ...

  2. js改变HTML元素的值

    js改变HTML元素的值(常用,备忘) <!DOCTYPE html> <html> <body> <h1>我的第一段 JavaScript</h ...

  3. 判断display为隐藏还是显示及获取css

    <html lang="en"> <head> <title>判断display为隐藏还是显示及获取css</title> < ...

  4. CSS样式----css样式表和选择器(图文详解)

    本文最初于2015-10-03发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 本文主要内容 CSS概述 CSS和HTML结合的三种方式:行内样 ...

  5. CSS样式----CSS的继承性和层叠性(图文详解)

    CSS的继承性 我们来看下面这样的代码,来引入继承性: 上方代码中,我们给div标签增加红色属性,却发现,div里的每一个子标签<p>也增加了红色属性.于是我们得到这样的结论: 有一些属性 ...

  6. CSS样式----CSS样式表的继承性和层叠性(图文详解)

    本文最初于2017-07-29发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 本文重点 CSS的继承性 CSS的层叠性 计算权重 ...

  7. CSS样式----CSS属性:字体属性和文本属性(图文详解)

    本文最初于2015-10-04发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 本文重要内容 CSS的单位 字体属性 文本属性 定 ...

  8. (知识点)JS中获取元素的样式

    首先我们已经知道了JavaScript如果获取一个元素的内部样式,你可以这样做: <div id="box" style="width:100px;height:1 ...

  9. js兼容获取元素的样式

    js获取元素的样式的兼容性处理: function getStyle(obj,attr){ return obj.currentStyle?obj.currentStyle[attr]:getComp ...

随机推荐

  1. Python——@property属性描述符

    @property 可以将python定义的函数“当做”属性访问,从而提供更加友好访问方式,但是有时候setter/getter也是需要的 假设定义了一个类Cls,该类必须继承自object类,有一私 ...

  2. 【Java】Java_14 循环结构

    循环结构 当型:当P条件成立时(T),反复执行A,直到P为“假”时才停止循环. 直到型:先执行A, 再判断P,若为T,再执行A,如此反复,直到P为F. 1.While循环 while循环的基本格式和流 ...

  3. 区分Activity的四种加载模式

    在多Activity开发中,有可能是自己应用之间的Activity跳转,或者夹带其他应用的可复用Activity.可能会希望跳转到原来某个Activity实例,而不是产生大量重复的Activity. ...

  4. Jenkins2.x Pipeline持续集成交互

    原文地址:http://blog.csdn.net/aixiaoyang168/article/details/72818804 Pipeline的几个基本概念: Stage: 阶段,一个Pipeli ...

  5. Docker 安装docker-compose多容器管理服务

    原文地址:https://github.com/eacdy/spring-cloud-book/blob/master/3%20%E4%BD%BF%E7%94%A8Docker%E6%9E%84%E5 ...

  6. windows服务器下配置memcache最大内存值

    windows服务器下修改memcache配置要求如下: 1.用内网ip的方式提供web应用服务器调用,不允许直接通过外网调用,如将memcache服务放在192.168.1.168的服务器上 2.修 ...

  7. ucosii任务切换OS_TASK_SW()

    stm32F103中任务切换定义 //任务切换宏,由汇编实现. #define OS_TASK_SW() OSCtxSw() os_cpu_a.asm中任务切换函数的定义 NVIC_INT_CTRL ...

  8. ping的原理以及ICMP

    ping 的原理:     ping 程序是用来探测主机到主机之间是否可通信,如果不能ping到某台主机,表明不能和这台主机建立连接.     ping 使用的是ICMP协议,它发送icmp回送请求消 ...

  9. unity, write/read txt file

    在Assets下新建文件夹StreamingAssets.然后下面代码可在其中生成test.txt文件,并读写: using UnityEngine;using System.Collections; ...

  10. Linux命令常用命令

    查看主机IP ifconfig 切换目录 cd cd /home cd /path cd ../path cd 退到home目录 cd .. 退到上层目录 cd / 退到根目录  ls -l 列出数据 ...