前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >12样式操作

12样式操作

作者头像
Dreamy.TZK
发布2020-04-22 17:44:44
3430
发布2020-04-22 17:44:44
举报
文章被收录于专栏:小康的自留地小康的自留地

获取内联样式

代码语言:javascript
复制
<p id="p1" style="color: red;">666</p>
  1. 内联样式即写在标签里的样式(返回文本类型)
代码语言:javascript
复制
var pElement = document.getElementById('p1').getAttribute('style')
console.log(pElement)
  1. 通过DOM对象获取。(返回对象)
代码语言:javascript
复制
var pElement = document.getElementById('p1')
console.log(pElement.style)

对象的方法如下:

  • cssText 声明块的文本内容
  • length 属性数量
  • item() 属性名
  • getPropertyValue() 属性值

获取外联样式

代码语言:javascript
复制
var stylesheetList = document.styleSheets
console.log(stylesheetList)

其中CSSRule对象包含一组css规则

可以修改href文件实现更换全局样式。

获取当前有效样式

代码语言:javascript
复制
var i = document.getElementsByTagName('input')[0]
console.log(window.getComputedStyle(i))

返回结果为CSSStyleDeclaration

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2020-04-21,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 获取内联样式
  • 获取外联样式
  • 获取当前有效样式
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档