原生js判断某个元素是否有指定的class名的几种方法
【注意】以下方法只对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名的几种方法的更多相关文章
- 函数语法:原生js判断某个元素是否有指定的class名的几种方法
var aLi = document.querySelectorAll('#tabs li'); for(var i = 0;i <p.length;i++){ //第一种方法,用classLi ...
- 【转载】 原生js判断某个元素是否滚动到底部
document.querySelector('.content').addEventListener('scroll',function () { //读取内容区域的真实高度(滚动条高) // co ...
- 原生js判断css动画结束 css 动画结束的回调函数
原文:原生js判断css动画结束 css 动画结束的回调函数 css3 的时代,css3--动画 一切皆有可能: 传统的js 可以通过回调函数判断动画是否结束:即使是采用CSS技术生成动画效果,Jav ...
- js判断一个元素是否在数组中
js判断一个元素是否在数组中 var arr = ['a','s','d','f']; console.info(isInArray(arr,'a'));//循环的方式 function isInAr ...
- 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题
1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...
- java中把文件拷贝到指定目录下最简单几种方法
java中把文件拷贝到指定目录下最简单几种方法 String savePath = "D:/file";// 文件保存到d盘的file目录下 File savefile = n ...
- 原生js判断css3动画过度(transition)结束 transitionend事件 以及关键帧keyframes动画结束(animation)回调函数 animationEnd 以及 css 过渡 transition无效
上图的 demo 主要讲的 是 css transition的过渡回调函数transitionend事件: css3 的时代,css3--动画 一切皆有可能: 传统的js 可以通过回调函数判断动画 ...
- jquery and js 判断一个元素是否存在
一.javascript中判断一个元素是否存在 if(document.getElementById('example')){ // do sth } 二.jquery中判断一个元素是否存在 < ...
- js 判断一个元素是否在滚动的可视区域内,不在就固定到可视区域的上方。
前言:最近工作中,有这样一个场景,判断一个元素是否在滚动的可视区域内,不在就固定到可视区域的上方.为了以后再次遇到,所以记录下来,并分享.转载请注明出处:https://www.cnblogs.com ...
随机推荐
- 服务器:RAID、AHCI、IDE
RAID 独立磁盘冗余阵列(RAID,redundant array of independent disks)是把相同的数据存储在多个硬盘的不同的地方(因此,冗余地)的方法.通过把数据放在多个硬盘上 ...
- pagination分页插件
最近做了个项目,有用到分页, 这类插件应该是很常用的, 虽然网上很多现成的分页插件, 但是还是想着自己写一个, 给自己积累点东西, 顺便练练手, 写了差不多3个小时左右, 代码如下: 代码: < ...
- 《think in python》学习-6
think in python 有返回函数 我们使用过的内置函数中,有一部分会返回结果,比如 math的 返回值 我们写一个有返回值的函数,计算给定半径的圆的面积,例如这个: def area(rad ...
- Asp.Net之三层架构
三层架构之理论: 通常意义上讲的三层架构就是将整个项目应用划分为:表现层(UI),业务逻辑层(BLL),数据访问层(DAL).与传统的二层架构的区别在于在用户界面(UI)和数据库服务器之间,添加中间层 ...
- gcc -lpthread 干什么用
#include <stdio.h> #include <pthread.h> void *ThreadFunc(void *pArg) //参数的值为123 { int i ...
- getchar()用法
getchar() .从缓冲区读走一个字符,相当于清除缓冲区 .前面的scanf()在读取输入时会在缓冲区中留下一个字符'\n'(输入完s[i]的值后按回车键所致),所以如果不在此加一个getchar ...
- attribute和property兼容性分析
上一篇文章中,详细的分析了他们的区别,请看Javascript中的attribute和property分析 这次,来详细的看下他们的兼容性,这些内容主要来自于对于jQuery(1.9.x)源代码的分析 ...
- jquery结合Highcharts插件实现动态数据仪表盘图形化显示效果
仪表盘显示效果如图: 方法一效果图: 方法二效果图(插件版本4.0.1): js代码如下: $(function(){ //方法一: var chart = new Highcharts.Char ...
- 贴片方式COB COF COG
英文简称: COB英文全称: Chip On Board中文全称: 通过邦定将IC裸片固定于印刷线路板上 英文简称: COF 英文全称: Chip On FPC 中文全称: 将IC固定于柔性线路板上 ...
- Delphi在StatusBar上绘制ProgressBar
首先,在TForm的私有域,也就是private下设置两个变量ProgressBar.ProgressBarRect,其中ProgressBar为 TProgressBar类型,ProgressBar ...