【注意】以下方法只对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. 浅谈hadoop中mapreduce的文件分发

    近期在做数据分析的时候.须要在mapreduce中调用c语言写的接口.此时就须要把动态链接库so文件分发到hadoop的各个节点上,原来想自己来做这个分发,大概过程就是把so文件放在hdfs上面,然后 ...

  2. Service的基本组成

    Service与Activity的最大区别就是一有界面,一个没有界面. 如果某些程序操作很消耗时间,那么可以将这些程序定义在Service之中,这样就可以完成程序的后台运行, 其实Service就是一 ...

  3. Visual Studio使用技巧

    编程部分: 1.TODO:书签 打开之后返回上次工作的位置.让我们不再用脑子去记忆,去回顾刚刚工作到的部分. 操作非常easy.例如以下代码所看到的: public DataTable SelectB ...

  4. 你想不到的压缩方法:将javascript文件压缩成PNG图像存储

    这样可以做到很高的压缩比,到底有多高,下面会提到.这种方法用到了 canvas 控件,这也意味着只有支持 canvas 控件的浏览器下才有效. 现在你可以看到,上面的图像类似一个噪声图像,但它实际上是 ...

  5. SQL常用函数

    SQL中常用的函数有类型转换函数.字符串函数和日期使用函数.更多具体的函数用法参见DBMS中的帮助文档. 类型转换函数 cast(值 as 类型) update 表名 set 列1=列1+cast(列 ...

  6. @Html.ValidationSummary()的使用

    @Html.ValidationSummary()用于返回表单在后台验证的结果. 如, 当后台if (ModelState.IsValid)失败后,错误信息就会显示到 @Html.Validation ...

  7. OCP prepare 20140701

    1. rman的完全备份,和不完全备份 Oracle 数据库可以实现数据库不完全恢复与完全恢复.完全恢复是将数据库恢复到最新时刻,也就是无损恢复,保证数据库无丢失的恢复.而不完全恢复则是根据需要特意将 ...

  8. 对List对象按照某个成员变量进行排序

    /** * 对List对象按照某个成员变量进行排序 * @param list List对象 * @param sortField 排序的属性名称 * @param sortMode 排序方式:ASC ...

  9. char str[] 与 char *str的区别详细解析

    char* get_str(void) { char str[] = {"abcd"}; return str; } char str[] = {"abcd"} ...

  10. 安装Eclipse Html Editor

    最近在eclipse中开发android项目,用到了jquery mobile框架,则会涉及到新建html文件,发现eclipse不自带新建html文件的插件,必须得新建一个其他形式的文件,譬如xml ...