二、DOM

DOM是"Document Object Model"(文档对象模型)的首字母缩写,当创建了一个网页并把它加载到WEB浏览器

中时,DOM就在后台生成,它讲根据你编写的网页文档创建一个文档对象。

javascript语言里的对象可以分为三种类型:

①用户定于对象(user-defined object):由程序员自行创建的对象

②内建对象(native object):内建在javascript语言里的对象,如Array,math,date等。

③宿主对象:(host object):由浏览器提供的对象

getElementById()方法

DOM提供一个名为getElementById()的方法,这个方法将返回一个与那个有着给定ID属性值得元素节点相对应

的对象。(注意:javascript区分大小写)

这个方法是与document对象相关联的函数,在脚本代码里,函数名的后面必须根由一组圆括号,这组圆括号

包含着函数的参数。getElementById()方法只有一个参数:你想获得的那个元素的id属性值,这个id值必须

放在单引号或双引号里。

document.getElementById(id)

例:

结果返回的事:object

getElementsByTagName()方法

getElementsByTagName()方法将返回一个对象数组,每个对象分别对应着文档里有着定标签的一个元素。

将会返回object

小结:

一份文档就是一颗节点树

节点分为不同的类型:元素节点、属性节点和文本节点等。

getElementById()方法将返回一个对象,该对象对应着文档里的一个特定的元素节点。

这些节点中的每个都是一个对象。

getAttribute()方法

getAttribute()方法是一个函数。它只有一个参数--你打算查询的属性的名字:

Object.getAttribute(attribute)

getAttribute()方法不能通过document对象调用,我们只能通过一个元素节点对象调用它。

与getElementsByTagName方法结合,去查询每个<p>元素的title属性

setAttribute()方法

setAttribute()方法与其他几个方法的区别是它允许我们队属性节点的值进行修改。

setAttribute()方法要求我们向他传递两个参数:

setAttribute(attribute,value)

javascript学习笔记(二)的更多相关文章

  1. Javascript学习笔记二——操作DOM

    Javascript学习笔记 DOM操作: 一.GetElementById() ID在HTML是唯一的,getElementById()可以定位唯一的一个DOM节点 二.querySelector( ...

  2. JavaScript学习笔记(二)——闭包、IIFE、apply、函数与对象

    一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...

  3. javascript学习笔记二

    1.js的string对象 **创建 String对象 *** var str = "abc"; **方法 和 属性(文档) *** 属性 length : 字符串的长度 ***方 ...

  4. javascript学习笔记(四) Number 数字类型

    数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数  toExponential() 方法 用科学 ...

  5. JavaScript学习笔记之数组(二)

    JavaScript学习笔记之数组(二) 1.['1','2','3'].map(parseInt) 输出什么,为什么? ['1','2','3'].map(parseInt)//[1,NaN,NaN ...

  6. amazeui学习笔记二(进阶开发4)--JavaScript规范Rules

    amazeui学习笔记二(进阶开发4)--JavaScript规范Rules 一.总结 1.注释规范总原则: As short as possible(如无必要,勿增注释):尽量提高代码本身的清晰性. ...

  7. Javascript学习笔记三——操作DOM(二)

    Javascript学习笔记 在我的上一个博客讲了对于DOM的基本操作内容,这篇继续巩固一下对于DOM的更新,插入和删除的操作. 对于HTML解析的DOM树来说,我们肯定会时不时对其进行一些更改,在原 ...

  8. AJax 学习笔记二(onreadystatechange的作用)

    AJax 学习笔记二(onreadystatechange的作用) 当发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态XMLHttpRequest对象提供了on ...

  9. ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring

    接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...

  10. JavaScript学习记录二

    title: JavaScript学习记录二 toc: true date: 2018-09-13 10:14:53 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...

随机推荐

  1. 「BZOJ1095」[ZJOI2007] Hide 捉迷藏

    题目描述 Jiajia和Wind是一对恩爱的夫妻,并且他们有很多孩子.某天,Jiajia.Wind和孩子们决定在家里玩捉迷藏游戏.他们的家很大且构造很奇特,由N个屋子和N-1条双向走廊组成,这N-1条 ...

  2. Java并发工具类之线程间数据交换工具Exchanger

    Exchanger是一个用于线程间协做的工具类,主要用于线程间的数据交换.它提供了一个同步点,在这个同步点,两个线程可以彼此交换数据.两个线程通过exchange方法交换数据,如果一个线程执行exch ...

  3. 一种基于zookeeper的分布式队列的设计与实现

    package com.ysl.zkclient.queue; import com.ysl.zkclient.ZKClient; import com.ysl.zkclient.exception. ...

  4. Git 使用流程

    # 下载远程仓库到本地 git clone 仓库地址cd 本地仓库文件夹 # 创建本地开发分支并与远程开发分支关联 git checkout -b develop origin/developgit ...

  5. 前后端分离最佳实现,使用Nuxt.js快速搭建单页SSR应用

    通常我们搭建ssr应用需要自己选择多个组件集成到一起 webpack babel loaders router server-render 各种入口配置等 如果是基于vue+vuex+vue-rout ...

  6. shell脚本批量部署ssh

    日常运维工作中,需要给几十上百台服务器批量部署软件或者是重启服务器等操作, 这样大量重复性的工作一定很苦恼,本文给大家提供了最基本的批量操作的方法,虽然效率不高,对于初学者来说还是好理解.由于刚开始学 ...

  7. (转)mysql5.7 根据二进制文件mysqlbinlog恢复数据库 Linux

    原文:http://blog.csdn.net/qq_15058425/article/details/61196085 1.开始mysqlbinlog日志功能 先找打my.cnf文件的位置: 2.编 ...

  8. ActiveMQ--HelloWorld

    下载windows版本ActiveMQ,apache-activemq-5.15.3\bin\win64\activemq.bat 启动mq,ActiveMQ内置jetty,默认端口8161,默认用户 ...

  9. android学习-进程/线程管理-完整

    我们知道,应用程序的主入口都是main函数--"它是一切事物的起源" main函数工作也是千篇一律的, 初始化 比如ui的初始化,向系统申请资源等. 进入死循环 再循环中处理各种事 ...

  10. C语言中的条件编译

    通常情况,我们想让程序选择性地执行,多会使用分支语句,比如if-else 或者switch-case 等.但有些时候,可能在程序的运行过程中,某个分支根本不会执行. 比如我们要写一个跨平台项目,要求项 ...