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添加样式可以这样写的更多相关文章

  1. element-ui + vue ,ant-design + vue , Angular + ZORRO 实现表格自动横纵向合并单元格,并自动根据单元格数据进行添加样式

    element-ui + vue ,ant-design + vue , Angular + ZORRO 实现表格自动横纵向合并单元格,并自动根据单元格数据进行添加样式 本文重点写 element-u ...

  2. Javascrip动态添加样式,Dom操作,获取自定义属性

    var layer=document.querySelector('.layer') 添加样式: 添加单个样式: layer.style.display="block" 添加多个样 ...

  3. [转]用CSS给SVG <use>的内容添加样式

    来源:http://www.w3cplus.com/svg/styling-svg-use-content-css.html?utm_source=tuicool&utm_medium=ref ...

  4. DOM操作样式表及其兼容性

    DOM操作样式表的时候,存在很多浏览器兼容上的问题,测试的时候用的是Firefox 28.0.IE11.IE8.Chrome.测试的时候发现,不兼容问题基本上都是IE8和非IE浏览器之家的问题,很多I ...

  5. DOM Style样式对象的详细用法

    DOM Style样式对象的详细用法 HTML Style样式比较复杂,相应访问.修改方法也有所差异.参考相关资料,整理如下. 典型Html文件如下,有三种定义方式. <head>     ...

  6. 第一百一十六节,JavaScript,DOM操作样式

    JavaScript,DOM操作样式 一.操作样式 CSS作为(X)HTML的辅助,可以增强页面的显示效果.但不是每个浏览器都能支持最新的CSS能力.CSS的能力和DOM级别密切相关,所以我们有必要检 ...

  7. DomFlags - 给 DOM 添加书签,方便调试

    DomFlags 所以一款 Chrome 浏览器扩展程序提,供了一种新的方式与浏览器开发者工具互动.DomFlags 让你可以给 DOM 元素创建快捷键,就像用于导航 DOM 树的书签.它们可以帮助您 ...

  8. v-html里面添加样式

    项目中,使用V-html渲染的页面,要添加样式,改如何做 解决方案1:在updated生命周期函数中,js动态配置样式,代码如下: updated() { $('.msgHtmlBox').find( ...

  9. 原生js动态添加style,添加样式

    原生js动态添加style,添加样式 第一种 var style="[assign-url='"+str+"']{display:initial}"; var ...

  10. Vue.js随笔二(新建路由+component+添加样式+变量的显示)

    创建一个页面: 1.首先让我们看一下整个vue.js的目录,如下图所示: 2.现在让我们创建一个页面吧: 2-1首先你需要新建路由(就和建立一个如何找到项目文件的目录一个意思):进入src/route ...

随机推荐

  1. 数据结构高阶--AVL(平衡二叉树)(图解+实现)

    AVL树(平衡二叉树) 概念 二叉搜索树虽可以缩短查找的效率,但如果数据有序或接近有序二叉搜索树将退化为单支树,查找元素相当于在顺序表中搜索元素,效率低下.因此为了解决这个问题,两位俄罗斯的数学家发明 ...

  2. Ubuntu20.04创建快捷方式(CLion)

    打开命令行,创建在桌面上xxx.desktop文件 touch ~/Desktop/Clion.desktop 编辑desktop文件 [Desktop Entry] Encoding=UTF-8 N ...

  3. C++使用ODBC连接数据库遇到的问题

    C++使用ODBC连接数据库遇到的问题 1.SQL语句中包含中文无法正常执行的问题 2.字符与宽字符相互转化的问题 C++使用ODBC连接数据库遇到的问题 1.SQL语句中包含中文无法正常执行的问题 ...

  4. Day29 Linux相关命令的使用

    今日内容 基本概念 安装 基本命令 在linux上安装软件 jdk mysql jdk Nginx的安装 一.概述 1.Unix linux基于Unix,Unix由贝尔实验室在1969年开发 一开始由 ...

  5. echarts map地图中绘制浙江省市区县乡镇多级联动边界下钻的最新geojson数据文件获取和更新

    目录 ECharts Map地图的显示 GeoJSON数据文件获取 在ECharts中绘制浙江省的数据 ECharts Map地图的显示 ECharts支持地理坐标显示,专门提供了一个geo组件,在s ...

  6. c++11 线程池--鸿蒙OS

    一个你应该学习的线程池 说明 原理:线程+优先级队列.源码没有涉及STL,没有复杂高深的语法,安全性做得很好: queue的安全使用方式top和pop以及empty的判断都是使用了 std::lock ...

  7. ping localhost时出现::1的原因以及解决办法

    ping localhost时出现: 在cmd中ping localhost解析出来的是ipv6的::1的原因是windows有个优先解析列表,当ipv6的优先级高于ipv4时,就会出现这种情况. 具 ...

  8. python Flask 操作数据库(2)

    单表操作 数据准备 from flask import Flask from flask_sqlalchemy import SQLAlchemy class Config: DEBUG = True ...

  9. Safari浏览器对SVG中的<foreignObject>标签支持不友好,渲染容易错位

    在 svg 中需要写一个 markdown 编辑器,需要用到 <foreignObject> 绘制来html,编辑器选择了 simplemde.大致html部分结构如下,<markd ...

  10. 深度学习之Transformer网络

    [博主使用的python版本:3.6.8] 本次没有额外的资料下载 Packages ort tensorflow as tf import pandas as pd import time impo ...