HTML DOM 允许 JavaScript 改变 HTML 元素的样式。如何改变 HTML 元素的样式呢?

语法:

Object.style.property=new style;

注意:Object是获取的元素对象,如通过document.getElementById("id")获取的元素。

基本属性表(property):

注意:该表只是一小部分CSS样式属性,其它样式也可以通过该方法设置和修改。

看看下面的代码:

改变 <p> 元素的样式,将颜色改为红色,字号改为20,背景颜色改为蓝:

<p id="pcon">Hello World!</p>
<script>
var mychar = document.getElementById("pcon");
mychar.style.color="red";
mychar.style.fontSize="20";
mychar.style.backgroundColor ="blue";
</script>

结果:

JavaScript--改变 HTML 样式的更多相关文章

  1. javascript改变style样式和css样式

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

  2. js | javascript改变style样式和css样式

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

  3. 通过JavaScript改变HTML样式

    语法:Object.style.property=new style; 基本属性表如下: 示例: 改变 <p> 元素的样式,将颜色改为红色,字号改为20,背景颜色改为蓝: <p id ...

  4. JavaScript:改变 HTML 样式

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  5. jQuery中添加/改变/移除改变CSS样式例子

    在jquery中对于div样式操作我们会使用到CSS() removeClass() addClass()方法来操作了,下面我们就整理了几个例子大家一起来看看吧.     CSS()方法改变CSS样式 ...

  6. js改变css样式

      CreateTime--2017年10月31日15:14:12 Author:Marydon js改变css样式 1.js改变单个css样式 HTML部分 <div id="tes ...

  7. 改变HTML样式

    HTML DOM 允许 JavaScript 改变 HTML 元素的样式.如何改变 HTML 元素的样式呢? 语法: Object.style.property=new style; 注意:Objec ...

  8. 改变 HTML 样式 Object.style.property=new style;

    改变 HTML 样式 HTML DOM 允许 JavaScript 改变 HTML 元素的样式.如何改变 HTML 元素的样式呢? 语法: Object.style.property=new styl ...

  9. 8 HTML DOM 元素的查找与改变&改变CSS样式&HTML事件

    HTML DOM(Document Object Model)文档对象模型 当网页被加载时,浏览器会创建页面的文档对象模型. HTMLDOM 定义了用于HTML的一系列标准的对象.通过DOM,你可以访 ...

  10. 【问题】js 改变鼠标样式,chrome浏览器不能立即更新,暂没有解决办法

    元素的css,cursor可以改变鼠标样式.也就是鼠标放到元素上去时,改变为相应状态. 通过JS改变cursor时,我发现chrome浏览器不能立即更新,需要动一下鼠标才行,试了几个其它浏览器都是立即 ...

随机推荐

  1. ubuntu jdk和tomcat配置

    先查看linux的版通过file /sbin/init命令,下载对应版本的jdk. 我的ubuntu是64位的(桌面系统),所以下载的是jdk-7u71-linux-x64.tar.gz 在home的 ...

  2. 51NOD 1385凑数字(找规律?)

    >>点击进入原题测试<< 思路:这个题是真的想了蛮久,枚举了一下前一百就发现了规律,要想最短的话就是要构建1234567890这个字符串:刚开始找到的规律从1开始枚举到N,每满 ...

  3. maven profile多环境自动切换配置,配置分离,排除文件

    痛点: 在java开发的过程中,我们经常要面对各种各样的环境,比如开发环境,测试环境,正式环境,而这些环境对项目的需求也不相同. 在此之前,我们往往需要手动去修改相对应的配置文件然后打成war,才能部 ...

  4. BNUOJ 26224 Covered Walkway

    Covered Walkway Time Limit: 10000ms Memory Limit: 131072KB This problem will be judged on HDU. Origi ...

  5. Fast Matrix Calculation 矩阵快速幂

    One day, Alice and Bob felt bored again, Bob knows Alice is a girl who loves math and is just learni ...

  6. The Pilots Brothers' refrigerator DFS+枚举

    Description The game “The Pilots Brothers: following the stripy elephant” has a quest where a player ...

  7. [bzoj1115][POI2009]石子游戏Kam_博弈论_阶梯博弈

    石子游戏 Kam bzoj-1115 POI-2009 题目大意:给定n堆石子,两个人轮流取石子.每堆石子的个数都不少于前一堆石子.每次取后也必须维持这个性质.问谁有必胜策略. 注释:$1\le ca ...

  8. pt工具加字段脚本

    #!/bin/bashcnn_db=$1table=$2alter_conment=$3 cnn_host='192.168.10.14'cnn_user='root'cnn_pwd='123456' ...

  9. JavaSE学习笔记--Item1 注解Annotation

    从 JDK 5.0 開始, Java 添加了对元数据(MetaData) 的支持, 也就是 Annotation(注解). 什么是Annotation,以及注解的作用? 三个主要的 Annotatio ...

  10. Android Studio VS Eclipse (还在用Eclipse?你OUT了!)

    转载请注明本文出自大苞米的博客(http://blog.csdn.net/a396901990).谢谢支持! 公司派来一个去美国參加完AnDevCon大会的来给我们分享大会上学习的内容. AnDevC ...