用className选择元素

封装成函数

<title>无标题文档</title>
<script>
/*
window.onload=function ()
{
var oDiv=document.getElementById('div1');
var aLi=document.getElementsByTagName('li'); for(var i=0;i<aLi.length;i++)
{
if(aLi[i].className=='box')
{
aLi[i].style.background='red';
}
}
}*/
//函数封装
function getByClass(oParent,sClass)
{
var aResult=[];
var aEle=oParent.getElementsByTagName('*'); for(var i=0;i<aEle.length;i++)
{
if(aEle[i].className==sClass)
{
aResult.push(aEle[i]);
}
}
return aResult;
}
window.onload=function ()
{
var oDiv=document.getElementById('div1');
var aBox=getByClass(oDiv,'box'); for(var i=0;i<aBox.length;i++)
{
aBox[i].style.background='green';
}
}
</script>
</head> <body>
<ul id="div1">
<li class="box"></li>
<li></li>
<li class="box"></li>
<li></li>
<li></li>
<li></li>
<li class="box"></li>
</ul>
</body>

<title>无标题文档</title>
<script>
window.onload=function ()
{
var aA=document.getElementsByTagName('a');
for(var i=0;i<aA.length;i++)
{
aA[i].onclick=function ()
{
this.parentNode.style.display='none';
};
}
};
</script>
</head> <body>
<ul id="ull">
<li>2352345 <a href="javascript:;">隐藏</a></li>
<li>34654745 <a href="javascript:;">隐藏</a></li>
<li>sdfger <a href="javascript:;">隐藏</a></li>
<li>dsbfsd <a href="javascript:;">隐藏</a></li>
<li>dfs <a href="javascript:;">隐藏</a></li>
<li>436547<a href="javascript:;">隐藏</a></li>
</ul>
</body>

JS-DOM元素灵活查找的更多相关文章

  1. 8 HTML DOM 元素的查找与改变&改变CSS样式&HTML事件

    HTML DOM(Document Object Model)文档对象模型 当网页被加载时,浏览器会创建页面的文档对象模型. HTMLDOM 定义了用于HTML的一系列标准的对象.通过DOM,你可以访 ...

  2. 获取 js DOM元素中绑定的所有事件,模仿 chrome getEventListeners

    偶尔看到了这个问题,如何用JS获取元素某一事件上绑定的所有Listener? 突然觉得好像是有解决办法的,查了下,在 chrome 下,支持 window.getEventListeners(obj) ...

  3. JS DOM元素的操作(创建,添加,删除,和修改属性)

    1.1 创建 DOM 元素以及相应的追加方式 1.1.1  创建:document.createElement('div'); 添加: fatherEle.appendChild(ele); appe ...

  4. JS DOM元素

    // 为element增加一个样式名为newClassName的新样式 function addClass(element, newClassName) { var value = element.c ...

  5. js DOM 元素ID就是全局变量

    有人在twitter上提到了:在Chrome的JavaScript终端中,你只需要输入一个元素的ID,就可以访问到这个元素.@johnjbarton给了解释,这是因为所有的元素ID都是全局变量.本文再 ...

  6. js dom元素加载完成执行

    //dom ready执行 function ready(fn){ if(document.addEventListener){ document.addEventListener('DOMConte ...

  7. HTML DOM元素关系与操作

    <html> <head><title>DOM元素关系与操作</title></head> <body> <!-- div ...

  8. javascript中通过className灵活查找元素 例如我们要把根据class来进行修改样式

    一.背景:一个表单中,要修改一些li中有class=box的样式,将它的background设置为red红色.一般的做法是我们可以先找到父级元素 ,然后由父级元素找到所有相关tagName,最后,来一 ...

  9. JS1 js获取dom元素方法

     js获取dom元素方法  1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId")         其 ...

随机推荐

  1. From windows live writer

    天线数据长度: 4*14*9664*4 = 2164736 信道估计长度: 614400 均衡: 12*1200*4 = 57600

  2. vultr和digitalocean vps使用感受

    中国用户购买海外vps看中的是欧美vps性价比高,不必备案,隐私保护好.但是,由于涉及到vps代理推广,国内涌现大量vps推广站点,他们纯粹发布一些vps促销信息去吸引潜在买家,甚至根本没有使用过所推 ...

  3. Openjudge-计算概论(A)-求一元二次方程的根

    描述: 利用公式x1 = (-b + sqrt(b*b-4*a*c))/(2*a), x2 = (-b - sqrt(b*b-4*a*c))/(2*a)求一元二次方程ax2 + bx + c =0的根 ...

  4. python--tile函数

    1.函数的定义与说明 tile函数位于python模块 numpy.lib.shape_base中,功能是重复某个数组.比如tile(A,n),功能是将数组A重复n次,构成一个新的数组. 2.函数操作 ...

  5. .Net_把文件数据添加到数据库中(面试题)

    一个文本文件含有如下内容: 4580616022644994|3000|赵涛 4580616022645017|6000|张屹 4580616022645090|3200|郑欣夏 上述文件每行为一个转 ...

  6. python 实现excel转化成json文件

    1.准备工作 python 2.7 安装 安装xlrd -- pip install xlrd 2. 直接上代码 import xlrd from collections import Ordered ...

  7. c语言-经验之谈

    如果你是一个大牛,那就直接忽略这里. 如果你是一个新手,请继续向下看. 在自学计算机的路上真的很悲惨,如果你是在学校里面学习还算比较幸运. 针对编程来说,在学校里面学习的只是学会了语言,而很少有人学会 ...

  8. 标准IO库

    IO标准库类型和头文件

  9. QTP连接MYSQL数据库方法

    1.首先安装mysql数据驱动,qtp在windows系统下操作连接mysql,所以下载mysql-connector-odbc-   5.1.8-win32.msi 下载地址:http://mysq ...

  10. openwrt默认不开启wifi

    Openwrt默认不开启wifi,要开启的话, 修改这个文件: openwrt/trunk/package/kernel/mac80211/files/lib/wifi/mac80211.sh. 滚到 ...