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 ...
随机推荐
- Spring Boot+Mybatis:实现数据库登录注册与两种properties配置参数读取
〇.参考资料 1.hutool介绍 https://blog.csdn.net/abst122/article/details/124091375 2.Spring Boot+Mybatis实现登录注 ...
- jmeter 之 JSON 断言
1.JSON 断言所在位置:断言->JSON 断言 2.JSON断言中的字段解析 Assert JSON Path exists:json 表达式,判断所字段是否存在,存在则为True, 否则为 ...
- CH565/CH569W ETH-MAC例程现象使用说明
ETH-GMAC例程 使用MounRiver Studio(MRS)打开工程. 点击编译按键,编译完成出现0错误,0警告. 打开WCHISPTOOLS,芯片型号选择CH569或者CH565(根据评估版 ...
- 数值分析——插值(一)、Runge现象
在数值分析中,插值方法是基础且重要的.本文将介绍Lagrange插值公式与Newton插值公式.此外,针对Runge现象,本文给出了稍稍详细的讨论. 一.Lagrange插值公式 假设函数 \(y=f ...
- [OpenCV实战]15 基于深度学习的目标跟踪算法GOTURN
目录 1 什么是对象跟踪和GOTURN 2 在OpenCV中使用GOTURN 3 GOTURN优缺点 4 参考 在这篇文章中,我们将学习一种基于深度学习的目标跟踪算法GOTURN.GOTURN在Caf ...
- java中String类型的相关知识的简单总结
java中String类型的相关知识总结 一.常用方法: 1.构造方法: byte数组 可指定offset和length 可指定charset char数组 可指定offset和count 字符序列 ...
- AspNetCore管道
title: Asp.Net Core底层源码剖析(一)中间件/管道 categories: 后端 tags: - .NET 当我们像下面这样添加一个管道时发生了什么? app.Use(async ( ...
- win32com操作word API精讲&项目实战 预告
对win32com的使用和研究有好一段时间了,想起本人刚开始做word编程项目时的各种痛苦:网上能找到的都是简单的示例,如同hello word一般,嚼之无味又无可奈何.读office的word接口文 ...
- [阿里云]Datahub测试使用记录
由于需要测试阿里云Datahub功能,因此测了一下Datahub的一些功能 DATAHUB: 简介: 阿里云的流式数据(streaming)处理平台 对流式数据的发布(publish)订阅(subsc ...
- 用溪流 WarKey 辅助红警开局快捷操作
背景 自从发现红警除了 ddraw 补丁可以在最新的系统里玩后,就开始怀旧了.但是由于手残,遇到别人抢地盘基本上直接崩了.偶然有一次发现像 08 这样的高手点 30 个坦克使用工具的.那么,我开局用工 ...