/*根据CSSNAME 得到对象列表
*/
function getElementByClassName(name,obj){
checkNode(obj,name.toUpperCase(),arr=new Array());
return arr;
}
/*内部方法 用于递归取得 对象列表
*/
function checkNode(node,cname,arr){
if(node.hasChildNodes()){
var obj=node.childNodes;
for(var i=0;i<obj.length;checkNode(obj[i],cname,arr),i++);
}
try{
if(node.className!=null){
var cnames=node.className.split(' ');
for(var i=0;i<cnames.length;(cnames[i].toUpperCase()==cname)?arr.push(node):null,i++) ;
}
}catch(err){}
}
<HTML>
<HEAD>
<TITLE>getElementByClassName</TITLE>
<style>
.fs{
border:1px solid red;
width:200px;
height:200px;
}
</style>
<script>
function get(){
/* 测试
*/
var s=document.getElementById('FF');
var obj=getElementByClassName('a',s);
//var obj=getElementByClassName('a',document);//对所有的进行
for(var i=0;i<obj.length;i++){
obj[i].className+=' fs';
}
}
</script>
</HEAD>
<BODY>
<a onclick="get()">get</a>
<div class="SS a ff ee " id="fds"></div>
<div id="FF"><div></div><div class="a"></div><div><div class="a"><div><span><hr /></span></div></div></div></div>
</BODY>
</HTML>
分享到：
相关推荐
3. `getElementByClassName`: 使用类名获取元素，返回的是一个HTMLCollection，同样即使只有一个元素也会返回。例如，`getElementByClassName('className')`将找到所有具有指定类名的元素。 4. `getElementByName`:...
1. **DOM操作**：通过`document.getElementById`、`querySelector`或`getElementByClassName`等方法获取DOM元素，然后改变它们的样式属性，如`style.left`、`style.top`、`style.width`、`style.height`等来实现动画...
这些只是`document`对象的一部分功能，实际上它还包含许多其他属性和方法，如`getElementByClassName()`, `getElementsByTagName()`, `getElementsByTagnameNS()`等，这些方法使得JavaScript成为动态更新网页的强大...
熟悉selectElementById、getElementByClassName等方法对于动态网页至关重要。 第四步：事件处理 事件是用户与网页交互时触发的特定动作。理解事件监听器、事件处理函数和事件冒泡是关键。学会如何响应用户的点击、...
7. **DOM遍历和选择器**：如querySelector()、querySelectorAll()、getElementByClassName()等，用于查找和操作DOM元素。 8. **拖放功能**：HTML5引入的拖放API，允许用户在页面元素之间拖放数据。 9. **表单控制*...
- **较慢的选择器**：class选择器（如`.className`）性能依赖于浏览器，某些浏览器可能没有原生的`getElementByClassName`方法，导致在IE浏览器中的性能下降。 - **最慢的选择器**：伪类选择器（如`$:hidden`）和...
7. **DOM操作**：通过`document.getElementById()`, `querySelector()`, `querySelectorAll()`, `getElementByClassName()`, `getElementsByTagName()`等获取DOM元素，使用`innerHTML`, `textContent`, `appendChild...
现代浏览器如Firefox、Safari、Chrome、Opera等支持`getElementByClassName()`方法，性能尚可；但在IE5-IE8中则相对较慢。 - **最慢的选择器**：**伪类选择器**和**属性选择器**。 - 如`$(':hidden')`用于选择所有...
3)element.getElementByClassName(class);通过属性类名来获取; 2:属性的set和get方法. 1)object.getAttribute(attribute);获取元素的属性.===>>>HTMLDOM: object.attribute; 2)object.setAttribute(attribute,...
或 var color = new ewColorPicker(document.getElementByClassName('demo')); //点击确定 color.config.sure = function(color){ //返回颜色值 } //点击取消 color.config.clear = function(d
getElementByClassName() 剪切文本.js 剪切文本（） 颜色转换器.js cutHex(); hexToR(); hexToG(); hexToB(); 添加JSfile.js 添加脚本（） 添加CSSfile.js 添加CSS() 添加类.js 添加类（） 您可以在 example.php 中...
getElementByClassName（） parseJSON（） stringifyJSON（） 某些代码可能是用ES6编写的，可能需要进行编译才能进行测试。 要求 在Chrome chrome://flags/#enable-javascript-harmony.上启用了ES6 chrome://...
自述文件- 如何运行 从下载整个目录并打开 Index.html 为主页和打开 views/pizza.html 为...*-多行 430,433,436,471,527 将查询选择器更改为更快的 getElementbyClassname 方法 *-line 472 - 将 randompizzas 的数量
在本文中，我们将探讨如何创建一个简单的JS库，包括两个常用的方法：`$` 和 `getElementByClassName`。 首先，让我们来看一下代码的结构。这段代码采用立即执行函数表达式(IIFE)来封装我们的库，这样可以避免全局...
尤其在旧版IE浏览器中，class选择器的执行可能较慢，因为这些版本的浏览器没有部署原生的getElementByClassName()方法。因此，在开发过程中，应尽量采用ID选择器和标签选择器，而避免使用性能较差的选择器。 此外，...