1.DOM(The Document Object Model)

A way to manipulate the structure and style of an HTML page.

It represents the internals of the page as the browser sees it, and allows the developer to alter it with JavaScript.

2.HTML is an XML-like structure

To access the DOM from JavaScript, the document object is used.

3.Getting an element

1)By ID

2)By Tag Name

document.getElementByTagName("a")

Returns a NodeList=an array of the DOM Elements

3)By Class Name

document.getElementByClassName

as TagName

4)By CSS Seclector

document.querySelector('#header'); =ID~~~

document.querySelectorAll(.btn);

【JS】Intermediate1:The DOM的更多相关文章

  1. 【JS】Intermediate7:jQuery:DOM API

    1.jQuery also makes performing actions on many elements at the same time simple 2.eg:$('.note').css( ...

  2. 【js】appendChild

    appendChild主要是用来追加节点插入到最后:循环的时候由于不停的搬家导致length在改变.     使用for循环 <!Doctype html> <html xmlns= ...

  3. 【JS】AJAX跨域-被调用方与调用方解决方案(二)

    解决跨域问题 跨域问题说明,参考[JS]AJAX跨域-JSONP解决方案(一) 实例,使用上一章([JS]AJAX跨域-JSONP解决方案(一))的实例 解决方案三(被调用方支持跨域-服务端代码解决) ...

  4. 【js】Leetcode每日一题-制作m束花所需的最少天数

    [js]Leetcode每日一题-制作m束花所需的最少天数 [题目描述] 给你一个整数数组 bloomDay,以及两个整数 m 和 k . 现需要制作 m 束花.制作花束时,需要使用花园中 相邻的 k ...

  5. 【js】Leetcode每日一题-完成所有工作的最短时间

    [js]Leetcode每日一题-完成所有工作的最短时间 [题目描述] 给你一个整数数组 jobs ,其中 jobs[i] 是完成第 i 项工作要花费的时间. 请你将这些工作分配给 k 位工人.所有工 ...

  6. 【js】Leetcode每日一题-数组异或操作

    [js]Leetcode每日一题-数组异或操作 [题目描述] 给你两个整数,n 和 start . 数组 nums 定义为:nums[i] = start + 2*i(下标从 0 开始)且 n == ...

  7. 【js】Leetcode每日一题-解码异或后数组

    [js]Leetcode每日一题-解码异或后数组 [题目描述] 未知 整数数组 arr 由 n 个非负整数组成. 经编码后变为长度为 n - 1 的另一个整数数组 encoded ,其中 encode ...

  8. 【js】Leetcode每日一题-叶子相似的树

    [js]Leetcode每日一题-叶子相似的树 [题目描述] 请考虑一棵二叉树上所有的叶子,这些叶子的值按从左到右的顺序排列形成一个 叶值序列 . 举个例子,如上图所示,给定一棵叶值序列为 (6, 7 ...

  9. 【js】Leetcode每日一题-子数组异或查询

    [js]Leetcode每日一题-子数组异或查询 [题目描述] 有一个正整数数组 arr,现给你一个对应的查询数组 queries,其中 queries[i] = [Li, Ri]. 对于每个查询 i ...

随机推荐

  1. 网页clientWidth等相关

    javascript代码:           function getInfo()          {          var s = "";          s += & ...

  2. 干货:Web应用上线之前程序员应该了解的技术细节

    [伯乐在线注]:<Web 应用上线前,程序员应考虑哪些技术细节呢?>这是 StackExchange 上面的一个经典问题贴. 最赞回复有 2200+ 顶,虽然大多数人可能都听过其中大部分内 ...

  3. opengl Test

    LIBS += -lGL -lGLU -lglut -lGLEW #include <GL/glut.h> #include <iostream> using namespac ...

  4. Python设计模式——设计原则

    1.单一职责原则:每个类都只有一个职责,修改一个类的理由只有一个 2.开放-封闭远程(OCP):开放是指可拓展性好,封闭是指一旦一个类写好了,就尽量不要修改里面的代码,通过拓展(继承,重写等)来使旧的 ...

  5. 使用openxml读取xml数据

    xml的数据格式如下: <?xml version="1.0"?> <Language Name="Chinese"> <Loca ...

  6. hdu 1568 Fibonacci 数学公式

    Fibonacci Problem Description 2007年到来了.经过2006年一年的修炼,数学神童zouyu终于把0到的Fibonacci数列(f[0]=0,f[1]=1;f[i] = ...

  7. MVC-ActionResult解说

    HttpNotFoundResult: 专门用来响应Http404找不到网页的错误,在System.Web.Mvc.Controller类别中内建了一个HttpNotFound()方法,可以很方便的回 ...

  8. ubuntu下的文本查看相关命令

    文本查看 1.cat命令(查看文本内容) 使用时三种常用模式 (1)cat 文本名 直接查看文本内容 (2)cat 文本名 -n 直接查看文本内容,但为文本中所有行编号 (3)cat 文本名 -b 直 ...

  9. Hbase region 某个regionserver挂掉后的处理

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAwoAAACdCAMAAAAjbX91AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK

  10. CSS3制作时钟

    这个效果是一个CSS3制作的时钟,不过并不是我们传统的时钟风格,分别用三块显示 时.分.秒三个部分,而且这个DEMO中藤藤还为其加上了一个js的效果,能让这个效 果和现实时钟的时间同步.这个效果运用到 ...