javascript中获取class
js中没有获取class的办法,找了一些封装好的方法,这里整理一下
(1)先进行封装
//封装getClass
function getClass(tagName,className) //获得标签名为tagName,类名className的元素
{
if(document.getElementsByClassName) //支持这个函数
{ return document.getElementsByClassName(className);
}
else
{ var tags=document.getElementsByTagName(tagName);//获取标签
var tagArr=[];//用于返回类名为className的元素
for(var i=0;i < tags.length; i++)
{
if(tags[i].class == className)
{
tagArr[tagArr.length] = tags[i];//保存满足条件的元素
}
}
return tagArr;
}
}
(2)主体程序
<ul>
<li class="dicTap">1</li>
<li class="dicTap">2</li>
<li class="dicTap">3</li>
<li class="dicTap">4</li>
</ul>
(3)获取class为dicTap的所有li内容程序
window.onload = function()
{ var topMenus = getClass('li','dicTap');
for(var i=0;i < topMenus.length; i++)
{
alert(topMenus[i].innerHTML);
} }
(4)项目中实际应用
//点击的 自定义属性personid,打开详情页面并且进行跨页面传值
var dicTap = getClass('li','dicTap');
for(var i=0;i <dicTap.length; i++)
{
dicTap[i].addEventListener('tap',function(){
var personId=this.getAttribute("personid");
localStorage.a=personId;
mui.openWindow({
url: 'disciplineDetail.html',
id:'disciplineDetail'
});
})
} //封装getClass
function getClass(tagName,className) //获得标签名为tagName,类名className的元素
{
if(document.getElementsByClassName) //支持这个函数
{ return document.getElementsByClassName(className);
}
else
{ var tags=document.getElementsByTagName(tagName);//获取标签
var tagArr=[];//用于返回类名为className的元素
for(var i=0;i < tags.length; i++)
{
if(tags[i].class == className)
{
tagArr[tagArr.length] = tags[i];//保存满足条件的元素
}
}
return tagArr;
}
}
javascript中获取class的更多相关文章
- javascript中获取非行间样式的方法
我们都知道一般在javascript中获取样式一般用的是nodeObj.style.attr这个属性的,但是这个属性只能获取行间样式非行间样式比如写在样式表中的样式那么用nodeObj.style.a ...
- javascript中获取dom元素的高度和宽度
javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...
- javascript中获取dom元素高度和宽度
javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...
- js | javascript中获取dom元素的高度和宽度
javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...
- JavaScript中获取HTML元素的方式
JavaScript中获取HTML元素的方式 1.使用id方式获取元素,返回一个具体对象 document.getElementById(id名) 2.使用className方式获取元素,返回类数 ...
- JavaScript中获取html元素常用手法和区分
对于许多前端开发项目来说,获取元素进行操作是必不可少的,例如tab标签,全屏切换,自动滚播等效果都需要通过获取节点元素来实现.下面我来总结下JavaScript最常用的4个Document对象中获取元 ...
- JavaScript中获取当前项目的绝对路径
近期在做JavaWeb项目相关的东西,差点儿每天都遇到非常多问题,主要是由于自己对JavaWeb方面的知识不是非常清楚,尽量把自己在项目中遇到的问题都记录下来,方便以后查阅. 在我们的项目中有这种须要 ...
- javascript中获取屏幕尺寸
Javascript获取获取屏幕.浏览器窗口 ,浏览器,网页高度.宽度的大小 屏幕的有效宽:window.screen.availHeight屏幕的有效高:window.screen.availWid ...
- Javascript中获取浏览器类型和操作系统版本等客户端信息常用代码
/** * @author hechen */ var gs = { /**获得屏幕宽度**/ ScreenWidth: function () { return window.screen.widt ...
- javascript中获取元素尺寸
Javascript获取获取屏幕.浏览器窗口 ,浏览器,网页高度.宽度的大小 屏幕可用工作区宽度:window.screen.availHeight,和浏览器无关,屏幕相关屏幕可用工作区高度:wind ...
随机推荐
- (1)angularJs
一. 1.下载 https://angularjs.org/ 2.网络引用 https://code.angularjs.org/ 3.模块内引用 angularjs <body ng-app& ...
- BZOJ1006神奇的国度 弦圖染色 最大勢算法
@[弦圖染色, 最大勢算法] Description K国是一个热衷三角形的国度,连人的交往也只喜欢三角原则.他们认为三角关系:即AB相互认识,BC相互认识,CA 相互认识,是简洁高效的.为了巩固三角 ...
- 转 Windows串口过滤驱动程序的开发
在Windows系统上与安全软件相关的驱动开发过程中,“过滤(filter)”是极其重要的一个概念.过滤是在不影响上层和下层接口的情况下,在Windows系统内核中加入新的层,从而不需要修改上层的软件 ...
- cef 下载地址
最新的CEF3源代码在:http://cefbuilds.com/CEF3的论坛:http://www.magpcss.org/ceforum/viewforum.php?f=5CEF3 C++开发环 ...
- IDEA一个窗口打开多个项目
首先IDEA没有Eclipse的Workspace的概念,且IDEA推荐是一个窗口对应着一个Project. 然后经过研究你会发现IDEA其实是由一个主进程来维护这些窗口的,所以即使你开了很多个窗口, ...
- 用Redis存储Tomcat集群的Session(转载)
本文转自http://blog.csdn.net/chszs/article/details/42610365 感谢作者 前段时间,我花了不少时间来寻求一种方法,把新开发的代码推送到到生产系统中部署, ...
- Android ANR原理分析
一.概述 ANR(Application Not responding),是指应用程序未响应,Android系统对于一些事件需要在一定的时间范围内完成,如果超过预定时间能未能得到有效响应或者响应时间过 ...
- 【swagger】2.swagger提供开发者文档--返回统一格式篇【spring mvc】【spring boot】
接着上一篇来说, 不管正常返回结果还是后台出现异常,应该返回给前台统一的响应格式. 所以这一篇就为了应对解决这个问题. ======================================== ...
- 老毛桃winpe优盘启动系统个性修改全攻略
PE优盘系统也有很多:大白菜.老毛桃.深度.通用PE工具箱.U大师.电脑店……这些PE优盘系统大多都会捆绑软件安装.更改主页等,一不小心,你就中招.虽然有些是可以自己去取消,但是启动画面还是带有各种L ...
- VC++中MCI播放音频文件 【转】
MCI播放mp3音频文件例程 源文件中需要包含头文件 Mmsystem.h,在Project->Settings->Link->Object/libray module中加入库 Wi ...