<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

    <style>

    .div1{width: 50px; height: 50px; background: yellow;}

    .div2{width: 50px; height: 50px; background: red; }

    </style>

    <script>

        window.onload=function(){

            /*只能获取元素 的第一个*/

         var odiv=document.querySelector('.div1');

          var oall=document.querySelectorAll('div');

         odiv.style.background="red";

         oall[1].style.height='1000px';

         var odiv3=document.getElementById('div3');

         /*类似于数组的对象*/

         alert(odiv3.classList);

         odiv3.classList.add('box7');

         odiv3.classList.remove('box3');

         odiv3.classList.toggle('box4');

        }

    </script>

</head>

<body>

<div class="div1"></div>

<div class="div2"></div>

<div id="div3" class="div3 div4 div5"></div>

</body>

</html>

html5 选择元素的更多相关文章

  1. HTML5结构元素

    前面的话 几年前,用于网页布局的一般都用div元素,但语义化并不好.HTML5引入了大量新的块级元素来帮助提升网页的语义,使页面具有逻辑性的结构.容易维护,并且对数据挖掘服务更加友好.本文将详细介绍H ...

  2. HTML5 template元素

    前言 转自http://www.zhangxinxu.com/wordpress/2014/07/hello-html5-template-tag/ 在单页面应用,我们对页面的无刷新有了更高的要求,H ...

  3. WebVTT 及 HTML5 <track> 元素简介

    https://dev.opera.com/articles/zh-cn/an-introduction-to-webvtt-and-track/ 简介 网络视频文本轨道,简称为 WebVTT, 是一 ...

  4. html5 新增元素以及css3新特性

    HTML5 1.HTML5 新元素 HTML5提供了新的元素来创建更好的页面结构: 标签 描述 <article> 定义页面独立的内容区域. <aside> 定义页面的侧边栏内 ...

  5. 抛弃jQuery：DOM API之选择元素

    原文链接:http://blog.garstasio.com/you-dont-need-jquery/selectors/ 我的Blog:http://cabbit.me/you-dont-need ...

  6. Jquery 系列（2） 选择元素

    Jquery基础学习 jQuery利用css选择符的能力,能够在DOM中快捷而轻松地获取元素. 主要内容如下: 介绍DOM树 如何通过CSS选择符在页中查找元素 扩展jQuery标准的CSS选择符 选 ...

  7. 三天学会HTML5 ——多媒体元素的使用

    目录 1. HTML5 Media-Video 2. HTML5 Media-Audio 3. 拖拽操作 4. 获取位置信息 5. 使用Google 地图获取位置信息 多媒体是互联网中的最重要的一部分 ...

  8. 【 D3.js 入门系列 --- 2 】 如何使用数据和选择元素

    接着上一讲的内容,这次讨论如何选择元素和使用数据.    现在页面中有三行文字,代码为: <p>Hello World 1</p> <p>Hello World 2 ...

  9. D3.js 其他选择元素方法

    在上一节中,已经讲解了 select 和 selectAll,以及选择集的概念.本节具体讲解这两个函数的用法. 假设在 body 中有三个段落元素: <p>Apple</p> ...

随机推荐

  1. .Net mvc 根据前台参数动态绑定对象

    业务需求:根据前台界面的参数,动态绑定对象 <param name="colNames">属性名拼接字符串</param><param name=&q ...

  2. java的反射

    JAVA反射机制是在运行状态中,对于任意一个类,都能够知道这个类的所有属性和方法:对于任意一个对象,都能够调用它的任意方法和属性:这种动态获取信息以及动态调用对象方法的功能称为java语言的反射机制. ...

  3. virtualenv 安装使用

      不同的人喜欢用不同的方式建立各自的开发环境,但在几乎所有的编程社区,总有一个(或一个以上)开发环境让人更容易接受. 使用不同的开发环境虽然没有什么错误,但有些环境设置更容易进行便利的测试,并做一些 ...

  4. c风格字符串

    1.字符数组截取 有当然有了,应均包含在<string.h>中. 有strncpy,strncat.可以帮你从任何位置,取得任意合法长度的字符串. 用法基本同strcpy,strcat. ...

  5. Django进阶（一）

    Url进阶 mysit/mysit/urls.py from django.conf.urls import url from django.contrib import admin urlpatte ...

  6. 【转】OpenGL超级宝典笔记——纹理映射Mipmap

    原文地址 http://my.oschina.net/sweetdark/blog/177812 , 感谢作者,若非法转载请联系本人. 目录[-] Mipmapping Mipmap过滤 构建Mip层 ...

  7. BZOJ 后缀自动机四·重复旋律7

    后缀自动机四·重复旋律7 时间限制:15000ms 单点时限:3000ms 内存限制:512MB 描述 小Hi平时的一大兴趣爱好就是演奏钢琴.我们知道一段音乐旋律可以被表示为一段数构成的数列. 神奇的 ...

  8. 【poj2154】 Color

    http://poj.org/problem?id=2154 (题目链接) 题意 n个珠子的项链,可以染上n中颜色,项链可以旋转不能翻转,求染色方案数. Solution 经典的公式: \begin{ ...

  9. jquery实现input输入框实时输入触发事件代码(点击历史记录也会触发)

    $("#email").bind('input propertychange', function() { if(/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0 ...

  10. IOS-Hybrid（混合开发）

    http://www.cnblogs.com/oc-bowen/p/5423902.html 1.1.     APP三种开发模式 智能手机之普及不用多说,手机APP渗投到各个行业:电商(淘宝.京东等 ...