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 ...
随机推荐
- 【SQL真题】SQL1: 各个视频的平均完播率 【AVG/SUM/IF/CASE】
题目: https://www.nowcoder.com/practice/96263162f69a48df9d84a93c71045753?tpId=268&tqId=2285032& ...
- 跨机房ES同步实战
作者:谢泽华 背景 众所周知单个机房在出现不可抗拒的问题(如断电.断网等因素)时,会导致无法正常提供服务,会对业务造成潜在的损失.所以在协同办公领域,一种可以基于同城或异地多活机制的高可用设计,在保障 ...
- Velero 系列文章(二):使用 Helm 安装 Velero
概述 本文是通过 Helm 3 来安装 Velero, 只做最基本的安装.并计划将 YAML (只备份 YAML, 不备份 Volume) 备份到腾讯云的 COS(兼容 S3, 所以可以通过 AWS ...
- Mattermost 笔记
目录 部署 配置 客户端 桌面程序 Android 使用 扩展 Jenkins Hubot 机器人 Jira GitHub Mattermost 是一个开源.可私有化部署的在线通讯平台,可以和Gith ...
- vue项目 h5上拉加载(分页功能)
<template> <div class="receivable"> <div class="application-header fle ...
- Qt大型工程开发技术选型Part3:Qt调用C#编写的COM组件实例
Qt大型工程开发技术选型Part3:Qt调用C#编写的COM组件实例以及错误总结 ok,前面铺垫了那么多,现在来写一个开发实例,我会把其中隐藏的坑和陷阱简单谈谈,并在文章最后总结. 不愿意看长篇大论的 ...
- 何为GUI???
1.GUI是什么–简介 GUI的全称为Graphical User Interface,图形化界面或图形用户接口,是指采用图形方式显示的计算机操作环境用户接口.与早期计算机使用的命令行界面相比,图形界 ...
- 手写Pinia存储的数据持久化插件
Pinia和Vuex的通病 Pinia和vuex的通病就是,页面刷新会导致数据丢失 解决通病 一.新建store import { defineStore } from 'pinia' //单独存放S ...
- 使用idea进行gitee代码管理
目录 1.在idea插件市场安装gitee插件 2.把本地仓库的release分支上的代码合到dev分支上 3.把本地dev分支上的代码合到远程dev分支上去 1.在idea插件市场安装gitee插件 ...
- [OpenCV实战]25 使用OpenCV进行泊松克隆
目录 1 Seamless Cloning实现 1.1 Seamless Cloning实例 1.2 正常克隆(NORMAL_CLONE)与混合克隆(MIXED_CLONE) 1.2.1 Normal ...