一: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. 【CF】270D Design Tutorial: Inverse the Problem

    题意异常的简单.就是给定一个邻接矩阵,让你判定是否为树.算法1:O(n^3).思路就是找到树边,原理是LCA.判断树边的数目是否为n-1.39-th个数据T了,自己测试2000跑到4s.算法2:O(n ...

  2. BZOJ1616: [Usaco2008 Mar]Cow Travelling游荡的奶牛

    1616: [Usaco2008 Mar]Cow Travelling游荡的奶牛 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 762  Solved:  ...

  3. %3A%2F%2F这样的叫什么码啊?

    %3A -> 3A -> 16*3+10 -> 58 -> chr(58) = ":"%2F -> 2F -> 16*2+15 -> 47 ...

  4. Linux给用户增加sudo权限

    有时候我们在Linux下执行sudo的时候,出现 xxx is not int the sudoers file 告诉我们当前用户不是sudoer,所以我们要把当前用户添加进去,步骤如下: 1.进入超 ...

  5. Objective-c初始化和便利构造

    1.创建一个Student这个类 2.声明和实现 1).在Studnet.h文件中对属性和方法的声明 其中这个方法是带参初始化 而这个方法是便利构造.注意与上边的区别 2.在Studnet.m中实现 ...

  6. Java 交换两个变量的数值

    一.参数传递方法 为解决标题问题,首先介绍参数传递方法.目前各类程序设计语言的参数传递方法主要有三种: 按值传递 按引用传递 按指针传递 其中按值传递表示方法(函数)接收的是调用者提供的变量的拷贝,不 ...

  7. hdoj 4324 Triangle LOVE【拓扑排序判断是否存在环】

    Triangle LOVE Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Tot ...

  8. BootStrap-table 客户端分页和服务端分页的区别

    当服务器没有对数据进行分页时,前端页面设计又要求进行分页,要分开来设置. 服务端分页: responseHandler: function(data){ return data.response; } ...

  9. oracle正则截取字符串的函数

    现在有这么一个需求, 数据库中的一个手输的'籍贯'字段,要按一定的规范截取显示在报表上,比如,如果'籍贯'的内容是:'山东省潍坊市昌乐县', 那么报表里要显示为:'山东昌乐', 如果'籍贯'是山东省潍 ...

  10. win10安装MySQL

    mysql的直接地址,可以复制地址使用下载工具下载:32位:http://cdn.mysql.com/Downloads/MySQL-5.6/mysql-5.6.26-win32.zip64位:htt ...