分享知识-快乐自己:JS 检查元素是否含有某种css样式
第一种 原生 JS:
************************************************************* 结构部分: <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名的情况
第二种 jquery:
$("#id").hasClass("className") ? console.log("Has this class.") : console.log("Do not has this class.");
分享知识-快乐自己:JS 检查元素是否含有某种css样式的更多相关文章
- 循序渐进BootstrapVue,开发公司门户网站(2)--- 使用wow.js动画组件以及自定义的CSS样式处理动态效果
在我们开发的页面中,让页面有一些动画效果,可以让页面更加有吸引力,只要不是处理太过,一般人还是希望有一些动态效果,如滚动动画加载,悬停处理变化等效果,本篇随笔介绍使用wow.js动画组件以及自定义的C ...
- 获取元素计算后的css样式封装
获取元素计算后的css样式封装: function getCss(obj,attribute) { if(obj.currentStyle) { return obj.currentStyle[att ...
- html5shiv主要解决IE6-8 无法识别HTML5的新标签,父节点不能包裹子元素,以及应用CSS样式
html5shivehtml5shiv主要IE6-8解决:1,HTML5提出的新的元素不被IE6-8识别.2,这些新元素不能作为父节点包裹子元素,3,并且不能应用CSS样式.让CSS 样式应用在未知元 ...
- JS笔记一:动态修改css样式
---恢复内容开始--- 最近在学习CSS/JS的样式,两个合学习一起学习,加深JS的书写和了解. 一.通过Javasript修改图片大小 通过函数来传递图片id,height,width,使用doc ...
- js检查元素是否包括在数组中
说明 在系统中须要检查税率填写的正确性,一定是国家规定的某几种税率,当然能够通过if else进行校验,可是还能够使用定义一个数组然后校验是否包括在元素中进行校验. 长处:加入税率无需改动逻辑,仅仅须 ...
- js中如何去获取外部css样式
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...
- js用currentStyle和getComputedStyle获取css样式(非行间) 兼容ie与火狐
用js的style属性可以获得html标签的样式,但是不能获取非行间样式.那么怎么用js获取css的非行间样式呢?在IE下可以用currentStyle,而在火狐下面我们需要用到getComputed ...
- 用JS打开网页时自动更改css样式,可用于处理浏览器兼容
代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...
- js的append拼接html丢失css样式解决
htmlApp += "<li id='leftli"+lunci+"'>"; htmlApp += "<span id='left ...
随机推荐
- 在多点环境下使用cas实现单点登陆及登出
CAS 介绍 CAS 是 Yale 大学发起的一个开源项目,旨在为 Web 应用系统提供一种可靠的单点登录方法,CAS 在 2004 年 12 月正式成为 JA-SIG 的一个项目.CAS 具有以下特 ...
- hdu1535——Invitation Cards
Invitation Cards Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others ...
- Zxing二维码解析——图文转换
一:文字转化为二维码图片. package com.xhm.tool; import java.util.Hashtable; import android.graphics.Bitmap; impo ...
- Linux中的关机
我是用普通用户登录,在终端下输入shutdown命令,结果显示 command not found.这就奇怪了,难道我的linux不支持这个命令?man了一下shutdown,大篇幅的说明告诉我,我的 ...
- vptr
#include <stdio.h> class Point3d { public: virtual ~Point3d(){} public: static Point3d origin; ...
- Java基础 - 变量的定义和使用
变量定义 public class Main { public static void main(String[] args) { // 定义byte类型的变量 byte b = 10; System ...
- zabbix server 端安装
1.系统环境 [root@crazy-acong ~]# cat /etc/redhat-release CentOS release 6.6 (Final) [root@crazy-acong ~] ...
- Java 重写 equals 与 hashCode 的注意事项
为什么重写 equals 的时候必须重写 hashCode 大家可能从很多教程中了解到: SUN官方的文档中规定"如果重定义equals方法,就必须重定义hashCode方法,以便用户可以将 ...
- RxJava2 源代码解析(一)
转载请标明出处: http://blog.csdn.net/zxt0601/article/details/61614799 本文出自:[张旭童的博客](http://blog.csdn.net/zx ...
- 路由器桥接(WIFI无线中继)设置及摆放位置图解
路由器桥接(WIFI无线中继)设置及摆放位置图解 WIFI实在好用,但它的波覆盖面小.穿透力很差.我们安装时要考虑波的衍射特点,装在衍射效果最佳的位置(居中,室外可绕,避开密封墙).确实无法兼顾的地方 ...