<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <title>test</title>

</head>

<body>

<h2 class="test">class="example" 的标题</h2>

<script>

    document.querySelector(".test").style.backgroundColor = "red";

</script>

</body>

</html>

　效果图

　

原生JS通过类名(className)获取dom元素的更多相关文章

  1. 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题

    1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...

  2. JS获取DOM元素的八种方法

    JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...

  3. JS1 js获取dom元素方法

     js获取dom元素方法  1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId")         其 ...

  4. js获取dom元素的子元素,父元素,兄弟元素小记

    原生jsvar a = document.getElementById("dom"); del_space(a); //清理空格 var b = a.childNodes; //获 ...

  5. js | javascript中获取dom元素的高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...

  6. Vue自定义指令获取DOM元素

    我们知道,Vue.js的核心是数据驱动,当数据有所变化时,DOM就会被更新,比如: <span v-text="msg"></span> export de ...

  7. Angular获取dom元素，以及父子组建之间相互传值

    1.使用原生js代码获取dom元素 在ts文件中有一个ngOnInit()的方法,这个方式是指在模块加载完毕之后并不是dom加载完毕,也就是说如果你的dom元素中使用的angular的指令,然后想在这 ...

  8. vue（4）—— vue的过滤器，监听属性，生命周期函数，获取DOM元素

    过滤器 vue允许自定义过滤器,我个人认为,过滤器有两种,一种是对数据的清洗过滤,一种是对数据切换的动画过滤 数据切换的动画过滤 这里还是利用前面的动态组件的例子: 这里由于没办法展示动画效果,代码如 ...

  9. Vue系列之 => ref获取DOM元素和组件

    可以获取DOM元素,和组件中的数据,方法 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

随机推荐

  1. java入门到秃路线导航，元芳你怎么看？【教学视频+博客+书籍整理】

    目录 一.Java基础 二.关于JavaWeb基础 三.关于数据库 四.关于ssm框架 五.关于数据结构与算法 六.关于开发工具idea 七.关于项目管理工具Mawen.Git.SVN.Gradle. ...

  2. ArcGIS制作地形图【详细步骤】

    结果图: 详细步骤: 一.在ArcSence中加载带有投影坐标系的dem数据 Dem的属性设置为下图可有上面的效果. 二.提取栅格范围 找到工具[3D Analyst][转换][栅格范围]双击打开设置 ...

  3. AS报错：lambda expressions are not supported at this language level

    AS报错:lambda expressions are not supported at this language level 解决方法 打开打开 File --> Project Stuct ...

  4. 明解C语言 入门篇 第一章答案

    练习1-1 #include <stdio.h> int main() { int a; a = 15; int b; b = 37; int c; c = a - b; printf(& ...

  5. 基于SkyWalking的分布式跟踪系统 - 异常告警

    通过前面2篇文章我们搭建了SW的基础环境,监控了微服务,能了解所有服务的运行情况.但是当出现服务响应慢,接口耗时严重时我们需要立即定位到问题,这就需要我们今天的主角--监控告警,同时此篇也是SW系列的 ...

  6. python学习之【第四篇】：Python中的列表及其所具有的方法

    1.前言 列表是Python中最常用的数据类型之一,是以[ ]括起来,每个元素以逗号隔开,而且里面可以存放各种数据类型,而且列表是有序的,有索引值,可切片,方便取值. 2.创建列表 li = ['he ...

  7. CF741D Arpa’s letter-marked tree and Mehrdad’s Dokhtar-kosh paths——dsu on tree

    题目描述 一棵根为1 的树,每条边上有一个字符(a-v共22种). 一条简单路径被称为Dokhtar-kosh当且仅当路径上的字符经过重新排序后可以变成一个回文串. 求每个子树中最长的Dokhtar- ...

  8. Vue 2.x 3.x 配置项目开发环境跟线上环境

    先找到package.json  (这是nuxt版的vue 可能会跟一般vue不一样  当然总体上差不多的) "scripts": { "dev": " ...

  9. 「Luogu 1349」广义斐波那契数列

    更好的阅读体验 Portal Portal1: Luogu Description 广义的斐波那契数列是指形如\(an=p \times a_{n-1}+q \times a_{n-2}\)的数列.今 ...

  10. day7-format字符串格式化

    tpl = "i am {name}, age {age}, really {name}".format(name="seven", age=18) print ...