(Lesson2)根据类名称和属性获得元素-JavaScript面向对象
描述:在编写选择器的时候遇到的一根问题,我需要实现Jquery的选择器功能,第一个根据ID获取Element非常简单,第二个根据类(class)去获取Element集合,这个相对复杂,而根据name和根据class的返回值是一样的,下面是详细说明:
首先我写了一个方法,这个方法是获得当前HTML的所有元素(标签),然后遍历寻找需要的元素。代码如下:
- function getElementsByClassName (className) {
- //获得所有的元素 all是元素集合
- var all = document.all ? document.all : document.getElementsByTagName('*');
- var elements = new Array();
- for (var e = 0; e < all.length; e++) {
- //根据class的名称与元素集合内的class比较
- if (className==all[e].className) {
- //写入新的数组
- elements[elements.length] = all[e];
- }
- }
- //返回筛选后的数组
- return elements;
- }
点击查看代码
在上诉代码中,可以根据修改属性去完成别的筛选,比如name,value等等。返回的是一个elements数组,大家不要忽略了。对于返回结果,下面还是演示个小的Demo,跳过了取值阶段,直接调用上面的function.
- function test(){
- var a=getElementsByClassName("abc");
- for(int i=0;i<a.length;i++)
- {
- a[i].style.color="blue";
- }
- }
点击查看代码
即所有的class为abc的元素,他们的文字颜色都变为了蓝色。在写的过程中看到了style,顺带提一下style的用法,上面的直接style.color是一种写法,大家要是为了方便的话可以直接使用style.cssText属性。使用方式:
- style.cssText="border:1px solid #000;margin-ledt:10px;background-color:#66CCFF";
类似在元素标签内直接写style样式的方式。
(Lesson2)根据类名称和属性获得元素-JavaScript面向对象的更多相关文章
- Javascript 面向对象(共有方法,私有方法,特权方法,静态属性和方法,静态类)示例讲解
一,私有属性和方法 私有方法:私有方法本身是可以访问类内部的所有属性(即私有属性和公有属性),但是私有方法是不可以在类的外部被调用. <script> /* * 私有方法:私有方法本身是可 ...
- 利用Java反射根据类的名称获取属性信息和父类的属性信息
代码: import java.lang.reflect.Field; import java.util.ArrayList; import java.util.Arrays; import java ...
- CSS 简介、语法、派生选择器、id 选择器、类选择器、属性选择器
CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现 ...
- HTML+CSS教程(五)外联样式、组选择器、圆角边框、样式优先级、伪类、盒子模型、元素溢出
一.外联样式 通过link标签引入外部css文件夹中的xxx.css文件到head标签中 例: 二. 1.组选择器 选择器名称1,选择器名称2,选择器名称3,…{属性:属性值;属性;属性值} 例: & ...
- moviepy音视频剪辑:视频剪辑基类VideoClip的属性及方法详解
☞ ░ 前往老猿Python博文目录 ░ 一.概述 在<moviepy音视频剪辑:moviepy中的剪辑基类Clip详解>和<moviepy音视频剪辑:moviepy中的剪辑基类Cl ...
- id选择器、类选择器、属性选择器
在网页编辑时,通常要对样式进行各种设置.我们借助CSS样式设计中的选择器,就能很好很方便的对它们进行管理和设置了. 今天,跟大家分享一下几个常用的选择器:id选择器.类选择器.属性选择器. id选择器 ...
- C# 根据类名称创建类示例
//获得类所在的程序集名称(此处我选择当前程序集) string bllName = System.IO.Path.GetFileNameWithoutExtension(System.Reflect ...
- [javaSE] 反射-获取类的成员属性和构造方法
成员属性和构造方法皆为对象,通过Class对象的方法可以得到 package com.tsh.reflect; import java.lang.reflect.Constructor; import ...
- 福利->KVC+Runtime获取类/对象的属性/成员变量/方法/协议并实现字典转模型
我们知道,KVC+Runtime可以做非常多的事情.有了这个,我们可以实现很多的效果. 这里来个福利,利用KVC+Runtime获取类/对象的所有成员变量.属性.方法及协议: 并利用它来实现字典转模型 ...
随机推荐
- kafka原理简介并且与RabbitMQ的选择
kafka原理简介并且与RabbitMQ的选择 kafka原理简介,rabbitMQ介绍,大致说一下区别 Kafka是由LinkedIn开发的一个分布式的消息系统,使用Scala编写,它以可水平扩展和 ...
- Linux管理日记(二)
14 启动内网端口转发 ### 2. 查看IP以及网卡信息 # 可以发现, eth0 的地址 inet addr:10.144.7.195, 此为内网网卡 # 公网网卡, eth1 的地址 inet ...
- Leetcode_114_Flatten Binary Tree to Linked List
本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/42744919 Given a binary tree, f ...
- 典型分布式系统分析: GFS
本文是典型分布式系统分析系列的第二篇,关注的是GFS,一个分布式文件存储系统.在前面介绍MapReduce的时候也提到,MapReduce的原始输入文件和最终输出都是存放在GFS上的,GFS保证了数据 ...
- C语言设计模式-封装-继承-多态
快过年了,手头的工作慢慢也就少了,所以,研究技术的时间就多了很多时间,前些天在CSDN一博客看到有大牛在讨论C的设计模式,正好看到了,我也有兴趣转发,修改,研究一下. 记得读大学的时候,老师就告诉我们 ...
- Android全局异常处理 实现自己定义做强制退出和carsh日志抓取
在做android项目开发时,大家都知道都会遇到程序报错或者Anr异常,会弹出来一个强制退出的弹出框,对于开发人员是好事,但是对于用户体验和 UI实在毫无违和感,别说用户接受不了,就连我们自己本身可能 ...
- 使IFRAME在iOS设备上支持滚动
原文链接: Scroll IFRAMEs on iOS原文日期: 2014年07月02日 翻译日期: 2014年07月10日翻译人员: 铁锚很长时间以来, iOS设备上Safari中超出边界的元素将不 ...
- C语言之多线程机制(程序可以同时被执行而不会相互干扰)
接触过linux的人或多或少知道,linux有多线程的机制,也就是说程序可以同时执行,不受干扰,关于这个在我以前的博文里有过类似模拟的时间片轮转程序,跟这个其实是类似的.其实在window上,线程的头 ...
- leetcode(58)-Range Sum Query - Immutable
题目: Given an integer array nums, find the sum of the elements between indices i and j (i ≤ j), inclu ...
- C# Word转为多种格式文件(Word转XPS/SVG/EMF/EPUB/TIFF)
一款有着强大的文档转换功能的工具,无论何时何地都会是现代办公环境极为需要的.在本篇文章中,将继续介绍关于Word文档的转换功能(Word转XPS/SVG/EMF/EPUB/TIFF)希望方法中的代码能 ...