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. CentOS 6磁盘配额

    可以指定用户能超过其配额限制.如果不想拒绝用户对卷的访问但想跟踪每个用户的磁盘空间使用情况,启用配额而且不限制磁盘空间的使用是非常有用的.也可指定不管用户超过配额警告级别还是超过配额限制时是否要记录事 ...

  2. python爬虫21 | 对于b站这样的滑动验证码,不好意思,照样自动识别

    今天 要来说说滑动验证码了 大家应该都很熟悉 点击滑块然后移动到图片缺口进行验证 现在越来越多的网站使用这样的验证方式 为的是增加验证码识别的难度 那么 对于这种验证码 应该怎么破呢 接下来就是 学习 ...

  3. SQL学习笔记:一些高级语句

    现在以MySQL为模板.学习的方法和别的数据库写法上会有不同,但是思路基本一致. 用到的数据库表的格式: +----+--------------+-------------------------- ...

  4. 使用HTML5 Canvas API

    一.检测浏览器支持情况 HTML5 Canvas的确是一个好东西,但是并不是所有浏览器都支持HTML5 Canvas的,这就要求我们在使用HTML5 Canvas前要检查浏览器是否支持这玩意儿. 在创 ...

  5. Java基础学习总结(85)——Java中四种线程安全的单例模式实现方式

  6. 使用lombok提高编码效率-----不用写get set

    使用lombok提高编码效率-----不用写get    set https://blog.csdn.net/v2sking/article/details/73431364

  7. Linear and Logistic Regression in TensorFlow

    Linear and Logistic Regression in TensorFlow Graphs and sessions TF Ops: constants, variables, funct ...

  8. mdbtools使用

    1.导入数据库到mysql(将key.mdb导入MySQL的test数据库,此时只导入表结构) mdb-schema key.mdb mysql | mysql -u root -p test 2.将 ...

  9. noip模拟赛 蒜头君救人

    分析:之前的一道模拟赛题是dp+dfs,这道题是dp+bfs. 我们设f[stu][i][j]为当前状态为stu,走到(i,j)的答案,考虑怎么设计stu,每个人的状态有3种:要么在原地,要么被背着, ...

  10. hdu 1185 状压dp 好题 (当前状态与上两行有关系)

    /* 状压dp 刚开始&写成&&看了好长时间T0T. 状态转移方程 dp[i][k][j]=Max(dp[i][k][j],dp[i-1][l][k]+num[i][j]);( ...