dom添加样式可以这样写
1、原生 js添加样式很多时可以合并在一起写:
var oPopwin = document.getElementById('vpage');
oPopwin.style.margin = 'initial';
oPopwin.style.marginTop = 'initial';
oPopwin.style.bottom = "0"
oPopwin.style.right = "0"
可以这样写简化代码:
var oPopwin = document.getElementById('vpage');
oPopwin.style ='margin:initial;marginTop:initial;bottom:0;right:0;'
2、HTML DOM classList 属性
可添加、删除一个或多个class
document.getElementById('div1').classList.add('add1','add2','add3')
document.getElementById("div1").classList.remove("add1",'add3')
3、JS的DOM获取元素可以这样写:
var oVpage = document.getElementById('vpage');
var tjpos=oVpage.getElementsByTagName('p')[0]
//tjpos是[object HTMLParagraphElement]
//<p class="tjpos">开屏测试视频</p>
console.log(tjpos)
dom添加样式可以这样写的更多相关文章
- element-ui + vue ,ant-design + vue , Angular + ZORRO 实现表格自动横纵向合并单元格,并自动根据单元格数据进行添加样式
element-ui + vue ,ant-design + vue , Angular + ZORRO 实现表格自动横纵向合并单元格,并自动根据单元格数据进行添加样式 本文重点写 element-u ...
- Javascrip动态添加样式,Dom操作,获取自定义属性
var layer=document.querySelector('.layer') 添加样式: 添加单个样式: layer.style.display="block" 添加多个样 ...
- [转]用CSS给SVG <use>的内容添加样式
来源:http://www.w3cplus.com/svg/styling-svg-use-content-css.html?utm_source=tuicool&utm_medium=ref ...
- DOM操作样式表及其兼容性
DOM操作样式表的时候,存在很多浏览器兼容上的问题,测试的时候用的是Firefox 28.0.IE11.IE8.Chrome.测试的时候发现,不兼容问题基本上都是IE8和非IE浏览器之家的问题,很多I ...
- DOM Style样式对象的详细用法
DOM Style样式对象的详细用法 HTML Style样式比较复杂,相应访问.修改方法也有所差异.参考相关资料,整理如下. 典型Html文件如下,有三种定义方式. <head> ...
- 第一百一十六节,JavaScript,DOM操作样式
JavaScript,DOM操作样式 一.操作样式 CSS作为(X)HTML的辅助,可以增强页面的显示效果.但不是每个浏览器都能支持最新的CSS能力.CSS的能力和DOM级别密切相关,所以我们有必要检 ...
- DomFlags - 给 DOM 添加书签,方便调试
DomFlags 所以一款 Chrome 浏览器扩展程序提,供了一种新的方式与浏览器开发者工具互动.DomFlags 让你可以给 DOM 元素创建快捷键,就像用于导航 DOM 树的书签.它们可以帮助您 ...
- v-html里面添加样式
项目中,使用V-html渲染的页面,要添加样式,改如何做 解决方案1:在updated生命周期函数中,js动态配置样式,代码如下: updated() { $('.msgHtmlBox').find( ...
- 原生js动态添加style,添加样式
原生js动态添加style,添加样式 第一种 var style="[assign-url='"+str+"']{display:initial}"; var ...
- Vue.js随笔二(新建路由+component+添加样式+变量的显示)
创建一个页面: 1.首先让我们看一下整个vue.js的目录,如下图所示: 2.现在让我们创建一个页面吧: 2-1首先你需要新建路由(就和建立一个如何找到项目文件的目录一个意思):进入src/route ...
随机推荐
- 5V降压转3.3V,5V转3V电路图芯片
5V降压转3.3V和3V都是低压,两个之间的压差效率,所以效率和工作温度这块都会比较优秀,输入和输出的最低压差外是越小越好. 1, 如果电流比较小,可以用LDO: PW6566 系列是使用 CMOS ...
- Python异步爬虫(aiohttp版)
异步协程不太了解的话可以去看我上篇博客:https://www.cnblogs.com/Red-Sun/p/16934843.html PS:本博客是个人笔记分享,不需要扫码加群或必须关注什么的(如果 ...
- 周结之json补充、正则re模块、hashlib模块、logging模块
周结 目录 周结 json补充 正则表达式 re模块 第三方模块的下载 request模块 办公自动化openpyxl模块 hashlib加密模块 subprocess模块 logging日志模块 j ...
- 前缀树(Tire)—Python
核心思想 空间换时间,是一种用于快速减速的多叉树结构,利用字符串的公共前缀来降低时间 优缺点: 优点:查询效率高,减少字符比较 缺点:内存消耗较大 每次都会从头向下一直到字符串结尾 前缀树 1 单个字 ...
- 史上最小 x86 Linux 模拟器「GitHub 热点速览 v.22.50」
本周 GitHub Trending 略显冷清,大概是国内的人们开始在养病,而国外的人们开始过圣诞.元旦双节.热度不减的 ChatGPT 依旧占据了本周大半的 GitHub 热点项目,不过本周的特推和 ...
- Java8时间日期处理新特性
Java8时间日期处理新特性 简介 伴随lambda表达式.streams以及一系列小优化,Java 8 推出了全新的日期时间API.Java处理日期.日历和时间的不足之处:将 java.util.D ...
- [cocos2d-x]判断两个矩形是否有交叉区域
bool Rect::intersectsRect(const Rect& rect) const { return !( getMaxX() < rect.getMinX() || r ...
- ng-alain创建组件添加路由导航菜单项基础步骤详解
首先呢~ 我们要在需要创建模块的路径例如AAA目录下,在终端打开(就是和在shell窗口打开一样的) 然后 ng g ng-alain:module XXXmodule 好了,创建了一个模块 接下来会 ...
- odoo中的字段创建后,不可以编辑
- Keil 5(Keil C51)安装与注册 [ 图文教程 ]
前言 Keil C51 是 51 系列兼容单片机 C 语言软件开发系统,支持 8051 微控制器体系结构的 Keil 开发工具,适合每个阶段的开发人员,不管是专业的应用工程师,还是刚学习嵌入式软件开发 ...