• 节点分为不同的类型：元素节点、属性节点和文本节点
  • getElementById()方法

这个方法将返回一个与那个有着给定id属性值的元素节点相对应的对象。注意大小写。该方法只有一个参数。这个参数也就是这个id值必须放在单引号或双引号里。

语法：document.getElementById(id)

  • getElementByTagName()方法

这个方法返回一个对象数组，每个对象分别对应着文档里有着给定标签的元素。

语法：document.getElementByTagName(tag)

可以利用length属性查出这个数组里的元素个数。document.getElementByTagName()方法允许把通配符作为参数，通配符作参数也必须放在引号里。如果你想知道某份文档里总共有多少个元素节点：

alert(document.getElementByTagName("*").length);

  • getAttribute()方法

只有一个参数就是你打算查询的属性的名字，语法：object.getAttribute(attribute)

getAttribute()方法不能通过document对象调用，只能通过一个元素节点对象调用它。所以，我们可以利用getAtrribute()方法把它的各种属性的值查询出来。

        <body>

        <h1>what to buy</h1>

        <p title="tips">Don't forget to buy this stuff</p>

        <ul id="purchases">

            <li>A tin of beans</li>

            <li>Cheese</li>

            <li>Milk</li>

        </ul>

        <script type="text/javascript">

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

               for(var i=0; i<paras.length; i++){

               alert(paras[i].getAttribute("title")); //tips

           }

        </script>

        </body>
  • setAtrribute()方法

这个方法允许我们队属性节点的值做出修改。setAtrribute()方法也是一个只能通过元素节点对相关调用，但setAtrribute()方法需要向它传递两个参数：

object.setAtrribute(attribute,value)

        <script type="text/javascript">

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

               for(var i=0; i<paras.length; i++){

               paras[i].setAttribute("title","new tips");

               alert(paras[i].getAttribute("title")); //new tips

           }

        </script>

setAtrribute()方法做出的修改不会反映在文档源代码里。

因为DOM的工作模式是：先加载文档的静态内容、再以动态方式对它们进行刷新，动态刷新不影响文档的静态内容。

第三章 DOM的基本的更多相关文章

  1. 《DOM Scripting》学习笔记-——第三章 DOM

    <Dom Scripting>学习笔记 第三章 DOM 本章内容: 1.节点的概念. 2.四个DOM方法:getElementById, getElementsByTagName, get ...

  2. 第三章 DOM

    节点的概念 5个常用的DOM方法:getElementById.getElementsByTagName.getElementsByClassName.getAttribute.getAttribut ...

  3. 第三章DOM

    1. DOM的概念 D:Document. O:Object.对象可以分为三类, 1. 用户自定义的对象. 2. 内建对象,如Array,Math,Date. 3. 宿主对象,浏览器提供的对象.如wi ...

  4. 读高性能JavaScript编程 第三章

    第三章  DOM Scripting  最小化 DOM 访问,在 JavaScript 端做尽可能多的事情. 在反复访问的地方使用局部变量存放 DOM 引用. 小心地处理 HTML 集合,因为他们表现 ...

  5. JavaScript DOM编程艺术-学习笔记（第三章、第四章）

    第三章: 1.js的对象分为三种:①用户自定义对象 ② 内建对象(js提供的对象) ③宿主对象(js寄宿的环境-浏览器,提供的对象) 2.文档是由节点组成的集合,即dom树,html元素是根元素,是唯 ...

  6. KnockoutJS 3.X API 第三章 计算监控属性(5) 参考手册

    计算监控属性构造参考 计算监控属性可使用以下形式进行构造: ko.computed( evaluator [, targetObject, options] ) - 这种形式是创建一个计算监控属性最常 ...

  7. 好记心不如烂笔头之JQuery学习，第三章

    第三章中主要讲了几个对DOM进行操作的方法. 归纳如下: 属性的获取和设置: //属性的获取 $("li").attr("title"); //属性的设置 $( ...

  8. 第10章DOM笔记

    第十章 DOM 一 Node类型 共有12种节点类型,每个节点都有nodeType属性,用于表明节点类型,nodename 表示标签名称 nodeValue始终为null 1.操作节点 a)  app ...

  9. Knockout应用开发指南 第三章：绑定语法（3）

    原文:Knockout应用开发指南 第三章:绑定语法(3) 12   value 绑定 目的 value绑定是关联DOM元素的值到view model的属性上.主要是用在表单控件<input&g ...

随机推荐

  1. android edittext 限制小数点后最多只能输入两位数字

    android:inputType="numberDecimal" private InputFilter lengthFilter = new InputFilter() { @ ...

  2. JAVA基础--IO输入输出(File使用)17

    一. File中的方法 1.  列举方法 /* * 获取指定目录以及子目录下的所有文件和文件夹 */ public class ListFilesDemo { public static void m ...

  3. 使用HTML辅助方法载入分部视图

    在webform中我们用过user control可以减少重复代码也利于将页面模组化, 在mvc中 叫分部视图 Partial View.   也就是一个片段的view.可以利用Partial vie ...

  4. 修改mac host文件绑定域名

    打开终端在终端terminal中输入 sudo vi /etc/hosts 上一步输入完成之后按enter回车键,如果当前用户账号有密码,则在按完之后会提示输入密码,此时输入当前账户密码后继续按ert ...

  5. 机器学习中的L1、L2正则化

    目录 1. 什么是正则化?正则化有什么作用? 1.1 什么是正则化? 1.2 正则化有什么作用? 2. L1,L2正则化? 2.1 L1.L2范数 2.2 监督学习中的L1.L2正则化 3. L1.L ...

  6. linux 之基本命令学习总结

    前言:从今天开始写这系列linux博客了(是学习刘遄老师的<linux就该这么学>),视频学习的资源可以在b站上找到:https://www.bilibili.com/video/av45 ...

  7. jQuery EasyUI/TopJUI创建日期输入框

    jQuery EasyUI/TopJUI创建日期输入框 日期时间输入框组件 HTML required:必填字段,默认为false:prompt:显示在输入框的提示性文字:pattern:日期格式 Y ...

  8. mac 修改mysql 密码， navicat 连接失败原因

    1.cd /usr/local/mysql/bin/
2.sudo su输入之后会要求输入你的计算机密码,输入的时候是什么都不显示的,输完后回车 3. ./mysqld_safe --skip-gra ...

  9. VLAN-8-VTP配置

    未配置域名的服务器不会发送任何VTP更新.  

  10. Vuex+axios

    Vuex+axios   Vuex简介 vuex是一个专门为Vue.js设计的集中式状态管理架构. 状态? 我们把它理解为在data中需要共享给其他组件使用的部分. Vuex和单纯的全局对象有以下不同 ...