【注意】以下方法只对class只有一个值的情况下操作

*************************************************************

结构部分:

<div>
   <p>1</p>
   <p class="test">2</p>
   <p>3</p>

</div>

**************************************************************

js部分:

var p = document.getElementsByTagName('p');

for(var i = 0;i <p.length;i++){

  //第一种方法,用classList这个H5 API,有兼容性问题

  if(p[i].classList.contains('test')==true){
    console.log(p[i].innerHTML);
      }

  //第二种方法,用className这个属性

  if(p[i].className=='test'){
    console.log(p[i].innerHTML)
     }

  //第三种方法,用getAttribute()这个方法

  if(p[i].getAttribute("class")=='test'){
        console.log(p[i].innerHTML);
    }

}

以上三种可以任选,条件是不考虑兼容性和多个class名的情况

原生js判断某个元素是否有指定的class名的几种方法的更多相关文章

  1. 函数语法:原生js判断某个元素是否有指定的class名的几种方法

    var aLi = document.querySelectorAll('#tabs li'); for(var i = 0;i <p.length;i++){ //第一种方法,用classLi ...

  2. 【转载】 原生js判断某个元素是否滚动到底部

    document.querySelector('.content').addEventListener('scroll',function () { //读取内容区域的真实高度(滚动条高) // co ...

  3. 原生js判断css动画结束 css 动画结束的回调函数

    原文:原生js判断css动画结束 css 动画结束的回调函数 css3 的时代,css3--动画 一切皆有可能: 传统的js 可以通过回调函数判断动画是否结束:即使是采用CSS技术生成动画效果,Jav ...

  4. js判断一个元素是否在数组中

    js判断一个元素是否在数组中 var arr = ['a','s','d','f']; console.info(isInArray(arr,'a'));//循环的方式 function isInAr ...

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

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

  6. java中把文件拷贝到指定目录下最简单几种方法

    java中把文件拷贝到指定目录下最简单几种方法   String savePath = "D:/file";// 文件保存到d盘的file目录下 File savefile = n ...

  7. 原生js判断css3动画过度(transition)结束 transitionend事件 以及关键帧keyframes动画结束(animation)回调函数 animationEnd 以及 css 过渡 transition无效

      上图的 demo 主要讲的 是 css transition的过渡回调函数transitionend事件: css3 的时代,css3--动画 一切皆有可能: 传统的js 可以通过回调函数判断动画 ...

  8. jquery and js 判断一个元素是否存在

    一.javascript中判断一个元素是否存在 if(document.getElementById('example')){ // do sth } 二.jquery中判断一个元素是否存在 < ...

  9. js 判断一个元素是否在滚动的可视区域内,不在就固定到可视区域的上方。

    前言:最近工作中,有这样一个场景,判断一个元素是否在滚动的可视区域内,不在就固定到可视区域的上方.为了以后再次遇到,所以记录下来,并分享.转载请注明出处:https://www.cnblogs.com ...

随机推荐

  1. network is unreachable 解决方案之一

    请按http://blog.csdn.net/oxiaoxio/article/details/41775183 一文中的设置方法设置:

  2. SQL事务与并发

    1.Transaction(事务)是什么: 事务是作为单一工作单元而执行的一系列操作.包括增删查改. 2.事务的种类: 事务分为显示事务和隐式事务: 隐式事务:就是平常我们使用每一条sql 语句就是一 ...

  3. NSIndexPath的初始化方法

    好几次用到了NSIndexPath,但是一直不知道怎么通过 row   section这两个参数来初始化 NSIndexPath *index = [NSIndexPath indexPathForR ...

  4. applicationContext.xml 配置文件的存放位置

    eb.xml中classpath:和classpath*:  有什么区别? classpath:只会到你的class路径中查找找文件; classpath*:不仅包含class路径,还包括jar文件中 ...

  5. php7 install script

    ./configure --prefix=/home/admin/local/php7 --with-gd=/home/admin/local/libgd-2.1.1/ --with-jpeg-dir ...

  6. python 32位、64位确定

    1.python 进入交互式命令行,如下: 2.执行以下命令: import struct;print struct.calcsize("P") * 8

  7. echarts的使用总结;

    题外话:好久没来博客园了,这几个月自己的工作经历可以算是相当丰富,其实一直不知道自己做web前端能做到什么时候,但是想说既然现在还在做着这个职位,就好好的学习.之前很少写js代码,来了新公司大多数都是 ...

  8. 分享一个自用的 Inno Setup 软件打包脚本

    此脚本支持打包mysql.安装mysql服务.安装windows服务.操作ini文件.操作注册表.高效压缩文件等功能,基本能满足常用的软件打包需求. ;定义各种常量 #define MyAppName ...

  9. 官方原版Adobe Acrobat XI Pro v11.0.0 序列号激活 可升级更新

    使用本人制作的正版激活向导,可以直接使用 注册机算号激活Adobe Acrobat XI Pro11 激活后可以直接官网升级更新软件,永久使用.下面是激活程序界面.简单易懂,傻瓜式操作.带有详细的安装 ...

  10. C语言入门(5)——运算符与表达式

    C语言中运算符和表达式数量之多,在高级语言中是少见的.正是丰富的运算符和表达式使C语言功能十分完善.这也是C语言的主要特点之一. C语言的表达式由运算符.常量及变量构成.C语言表达式基本遵循一般代数规 ...