分享知识-快乐自己: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 ...
随机推荐
- 【数据挖掘】分类之Naïve Bayes(转载)
[数据挖掘]分类之Naïve Bayes 1.算法简介 朴素贝叶斯(Naive Bayes)是监督学习的一种常用算法,易于实现,没有迭代,并有坚实的数学理论(即贝叶斯定理)作为支撑. 本文以拼写检查作 ...
- 嵌入式开发之手机arm汇总---科普手机arm
http://www.leiphone.com/news/201406/1102-zzl-arm.html
- CentOS Linux解决网卡报错Bringing up interface eth0.....
问题描述:在VMware里克隆出来的CentOS Linux,开机执行命令:ifconfig...没有看到eth0网卡.然后重启网卡又报以下错误:Bringing up interface eth0: ...
- 装服务器,测试数据库,简单的maven命令
[说明]今天总体回顾一下:大概是早上装服务器,下午测试数据库,晚上了解简单的maven命令 一:今日完成 1)在远程服务器的tomcat 设置好管理员的登录账号 2)登录tomcat 的项目管理 查看 ...
- Webpack探索【5】--- plugins详解
本文主要讲plugins相关内容. https://gitbook.cn/gitchat/column/59e065f64f7fbe555e479204/topic/59e96d87a35cf44e1 ...
- 默写一个socket客户端和socket服务端的基本通信,即:收发消息
Server: import socket sk = socket.socket() sk.bind(('192.168.0.95',8898)) #把地址绑定到套接字 sk.listen() #监听 ...
- (转)复习TCP/IP协议与Http协议的区别
TPC/IP协议是传输层协议,主要解决数据如何在网络中传输,而HTTP是应用层协议,主要解决如何包装数据.关于TCP/IP和HTTP协议的关系,网络有一段比较容易理解的介绍:“我们在传输数据时,可以只 ...
- rest-client restclient get post写法
get url = "https://api.weixin.qq.com/sns/jscode2session" data = { appid: "××××", ...
- 基本jquery
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...
- 3.15课·········out传值(传址)
public void Hs(out int a, out int b) { a = 4; b = 6; a = b++;//a=6,b=b+1=7//b先赋值给a,然后b+1 b = ++a;//a ...