一：id获取（全部浏览器兼容）

　　document.getElementById("");

 <body>

      <div id="box"></div>

 </body>

 <script>

       var box = document.getElementById("box");

 </script>

getElementById,它只有document对象才能使用，而且返回的是数组的第一个元素，他的方法名写明了是getElement不是getElements，不要搞混了。

以下几种获取的是元素的集合，是一个数组，所以引用的时候，记得加上下标：索引号

二：标签获取（全部浏览器兼容）

document.getElementsByTagName("");

<body>

    <p>标签获取</p>

</body>

<script type="text/javascript">

    var ps = document.getElementsByTagName("p");

    ps[0].onclick = function(){

        alert("标签获取");

    };

</script>

三：name获取（ie9及ie9以下不兼容）

<body>

    <div name="box">name获取</div>

</body>

<script type="text/javascript">

    var boxs = document.getElementsByName("box");

    boxs[0].onclick = function(){

        alert("name获取");

    };

</script>

四：className获取（ie9及ie9以上支持）

<body>

    <div class="box">className获取</div>

</body>

<script type="text/javascript">

    var boxs = document.getElementsByClassName("box");

    boxs[0].onclick = function(){

        alert("className获取");

    };

</script>

一个根据父元素查找classname的兼容方法

js获取标签的几种方式的更多相关文章

  1. js获取标签的三种方式

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. js获取时间戳的三种方式

      js获取时间戳的三种方式 CreateTime--2018年5月23日08:44:10 Author:Marydon // 方式一:推荐使用 var timestamp=new Date().ge ...

  3. js声明变量的三种方式

    JS 声明变量的三种方式 (1)使用变量步骤:a.声明-->b.赋值-->3.调用 正确用法: <script type="text/javascript"> ...

  4. Struts2(四.注册时检查用户名是否存在及Action获取数据的三种方式)

    一.功能 1.用户注册页面 <%@ page language="java" contentType="text/html; charset=UTF-8" ...

  5. js实现继承的5种方式 （笔记）

    js实现继承的5种方式 以下 均为 ES5 的写法: js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明确的继承机制,而是通过模仿实现的,根据js语言的本身的特性,js实现继承 ...

  6. 前端js,css文件合并三种方式,bat命令

    前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...

  7. 获取Type的三种方式

    using System;using UnityEngine; public class Type_Test : MonoBehaviour{    private void Awake()    { ...

  8. java动态获取WebService的两种方式（复杂参数类型)

    java动态获取WebService的两种方式(复杂参数类型) 第一种: @Override public OrderSearchListRes searchOrderList(Order_Fligh ...

  9. AngularJS中获取数据源的几种方式

    在AngularJS中,可以从$rootScope中获取数据源,也可以把获取数据的逻辑封装在service中,然后注入到app.run函数中,或者注入到controller中.本篇就来整理获取数据的几 ...

随机推荐

  1. LeetCode 面试:Add Two Numbers

    1 题目 You are given two linked lists representing two non-negative numbers. The digits are stored in ...

  2. lua metatable和metamethod元表和元方法

    Lua中提供的元表是用于帮助Lua数据变量完成某些非预定义功能的个性化行为,如两个table的相加.假设a和b都是table,通过元表可以定义如何计算表达式a+b.当Lua试图将两个table相加时, ...

  3. bzoj2337

    这句话感觉都能成定理了:xor问题逐位考虑……这道题就是这样,然后和bzoj3143和相似但这道题多了自环,于是我们设f[i]表示当前位由i走到n的后为1的数学期望显然f[n]=0,可得f[i]=si ...

  4. 如何配置jdk和tomcat 转

    一.配置JDK1.解压JDK至D:\JDK1.5目录下(楼主可以自由选取目录).2.设置环境变量(右键我得电脑->属性->高级->环境变量),在系统变量中添加一个叫JAVA_HOME ...

  5. TFS 2012使用简介（一）

    最近,一直想让团队加入敏捷开发,但TFS2010用下来,并不是令人满意,还好,TFS2012横空出世了.相比TFS2010,TFS2012改进太多了,主要体现在以下方面: Team Web Acces ...

  6. Xmpp integration with Asterisk

    http://gnu-linux.org/xmpp-integration-with-asterisk.html Xmpp stands for eXtensible Messaging and Pr ...

  7. crontab使用--linux下的定时任务程序

    crontab是一个linux下的定时运行程序,如果我们想让自己的程序定时执行, 可以把自己的程序交给这个程序来完成 第一步:配置crontab的脚本的默认编辑器,它的默认的编辑器不好用,我们配置vi ...

  8. Spring事务-三种实现方式

    一.引入JAR文件: 二.开始搭建分层架构---创建账户(Account)和股票(Stock)实体类 Account: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 ...

  9. MYSQL ERROR CODE 错误编号的意义

    mysql error code(备忘) 转1005:创建表失败 1006:创建数据库失败 1007:数据库已存在,创建数据库失败 1008:数据库不存在,删除数据库失败 1009:不能删除数据库文件 ...

  10. NULL不能和任何字段比较和运算

    UPDATE dbo.PayPalPaymentInfo SET GrossAmount=TotalPrice+TaxAmount WHERE GrossAmount IS NULL --如果TaxA ...