javascript通过className獲取文件元素

转载 2007年09月29日 17:07:00

在 JavaScript 內建的核心中,document 物件及 Element 物件總共可以透過三個方式來獲取其下的元素,分別是:

getElementById('id')
getElementsByName('name')
getElementsByTagName('tag')

這些方法就跟它們的名字一樣,分別是依照 id, name, tag 來獲取元素。

因在同一份文件中,id 是具有唯一性的,所以 getElementById(id) 的回傳值是單一物件可以直接使用;而其他則會傳回一個依照具有該屬性的元素在文件中出現順序排列的陣列,使用時必須指定陣列編號,如: array[0] 代表第一個元素。
可是在設計網頁時,最常常需要使用到的 class 卻沒有相對應的方法可以去獲取 className 相同的元素。
沒有沒關係,我們自己寫一個,而且代碼非常簡短只有下面幾句。
function getElementsByClassName(n) {
   
var el = []
,
       
_el = document.getElementsByTagName('*')
;
   
for (var i=0; i<_el.length; i++ ) {

       
if (_el[i].className == n ) {
           
el[el.length] = _el[i];
       
}

   
}
   
return el;
}
上面這段代碼將會傳回一個元素陣列,這些元素的共通點就是它們的 class 名稱都一樣。
下面這段代碼是 getElementsByClassName(’className’) 眾多應用的其中一種,可以將文件中所有 className 為 ‘black’ 的元素的 className 改為 ‘red’。
var classBlack = getElementsByClassName('black');
for (var i=0; i<classBlack.length; i++) {

   
classBlack[i].className = 'red';
}

 

js封装获取元素类名(className)的方法

封装了一个方法,用来通过父元素获取节点下的指定类名元素

21、Dom元素的灵活查找--通过className条件筛选

1、Dom元素的灵活查找  .如何用className 选择元素   -选出所有元素   -通过className条件筛选 1.1 html代码 点击 1...

JavaScript—className 属性

定义和用法   className 属性设置或返回元素的 class 属性。 语法 object.className=classname 实例   本例展示了两种获得 元素的 class 属...

document.getElementsByClassName:简单的原生通过className查找元素,可指定多个样式名称进行查找

//仅为使用习惯保留document.getElementsByClassName()调用方式,无法使用链式访问 HTMLDocument.prototype.getElementsByClassN...

JavaScript修改css中style,className,cssText实例

用 Javascript 修改网页样式 一、局部改变样式,分为改变直接样式,改变className和改变cssText三种。 需要注意的是:注意大小写问题 javascript对大小写十...
  • varrant
  • varrant
  • 2013年05月23日 11:22
  • 458

前端实践--JavaScript--控制类名(className 属性)+改变样式

通过className属性来设置元素的样式: 编写"改变颜色"、"改变宽高"、"隐藏内容"、"显示内容"、"取消设置"的函数,点击相应按钮执行相应操作,点击"取消设置"按钮后,提示是否取消设置,如是执...

如何使用UiObject获取控件的className

最近项目需要对Android应用进行自动化的遍历测试,学习了一下uiautomator工具,版本是API17,发现其中UiObject类中的getClassName()方法无效,很是困惑,查看了其源码...
  • wk8032
  • wk8032
  • 2015年04月09日 22:36
  • 463

JavaScript-给iframe里的内容定义样式 获取元素

案例1: 做一个通用的反馈表单应用在其它页面的框架里, 要求在框架外面可以定义框架里面的页面样式。 程序代码 var temp_css; temp_css=""; temp_css+="bo...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:javascript通过className獲取文件元素
举报原因:
原因补充:

(最多只允许输入30个字)