DOM节点的种类

　　元素和标签是一个意思，例如<body>标签或者称为<body>元素

　　节点DOM的节点分为三类  元素节点，文本节点，属性节点

　　例如

　　<div id=‘box’>例子</div>  其中元素节点就是指这个div，文本节点就是指‘例子’这个文本，属性节点是指id

查找和定位节点

　　查找元素JS提供的几种方法：

    1. getElementsById()　　　　　　
      document.getElementsById()
      DOM操作必须要等到HTML文档加载完毕才能进行
      怎样获取？
      （1）把含有DOM操作的<script>标签移后
      （2）使用onload事件
      window.onload = function(){
      //里面存放需要页面加载完毕后才要执行的代码
      }
      例如：
      window.onload=function(){
      var OneBox = document.getElementById('box');
      }
    2. OneBox.tagName 获取元素节点的标签名字
    3. OneBox.innerHTML 获取元素内的纯文本 注意纯文本的含意 包含HTML标签  是文本内容而不是文本节点
      同时可以通过innerHTML来修改内容即进行赋值，而且此时可以解析HTML了而不再是纯文本的形式了
      例如：OneBox.innerHTML='修炼<strong>JS</strong>';
    4. OneBox.id 获取id值
    5. OneBox.title 获取title值
    6. OneBox.style 获取style属性对象  如果想获取stley对象则需要类似这样获取：OneBox.style.css
    7. OneBox.className 获取css的class名字  即获取元素节点class属性的值
    8. OneBox.setAttribute('title','标题');创建一个属性和属性值
    9. getElementByTagName()
      documet.getElementsByTagName()
      例如HTML关于li标签的只有如下代码段：
      <ul>
          <li>示例1</li>
          <li>示例2</li>
      </ul>
      使用
      var OneLi = document.getElementsByTagName('li');
    10. OneLi就是一个带有li标签的HTML对象集合，利用OneLi[0]获取首个对象
    11. 同样有OneLi[0].innerHTML    OneLi[0].tagName
      ps:养成区分大小写的习惯
    12. getElementsByName()

2016.01.05 DOM笔记（一） 查找元素的更多相关文章

  1. 2016.01.07 DOM笔记（二） DOM节点

    node节点属性 nodeName属性 oneBox= document.getElementsById('box');var s = oneBox.nodeName;  //nodeName与tag ...

  2. DOM 之 document 查找元素方法

    DOM 之 document 查找元素方法 getElementById("idName"); // 始终取得第一个 idName 的元素 getElementsByTagName ...

  3. JavaScript DOM操作之查找元素节点

    概要: 编程接口 可通过 JavaScript 对 HTML DOM 进行访问. 所有 HTML 元素被定义为对象,而编程接口则是对象方法和对象属性. 方法是您能够执行的动作(比如添加或修改元素). ...

  4. extern “C”原理，用法以及使用场景-2016.01.05

    1 问题提出 在编程过程中,经常发现如下用法: #ifndef _FILE_NAME_H_ #define _FILE_NAME_H_ #ifdef __cplusplus extern " ...

  5. jQuery使用（四）：DOM操作之查找兄弟元素和父级元素

    查找兄弟元素 向下查找兄弟元素 next() nextAll() nextUntil() 向上查找兄弟元素 prev() prevAll() prevUntil() 查找所有兄弟元素 siblings ...

  6. C++笔记（7）——一些模拟题：简单模拟、查找元素、图形输出、日期处理、进制转换、字符串处理

    以下内容基本来自<算法笔记>,作者为胡凡,建议直接买书看,我这里只是摘抄部分当笔记,不完整的. 简单模拟 就是一类"题目怎么说你就怎么做"的题目.这类题目不涉及算法,只 ...

  7. 058 01 Android 零基础入门 01 Java基础语法 06 Java一维数组 05 案例：求数组元素的最大值

    058 01 Android 零基础入门 01 Java基础语法 06 Java一维数组 05 案例:求数组元素的最大值 本文知识点:求数组元素的最大值 案例:求数组元素的最大值 程序代码及其执行过程 ...

  8. 011 01 Android 零基础入门 01 Java基础语法 02 Java常量与变量 05 变量的三个元素的详细介绍之三—— 变量值——即Java中的“字面值”

    011 01 Android 零基础入门 01 Java基础语法 02 Java常量与变量 05 变量的三个元素的详细介绍之三-- 变量值--即Java中的"字面值" 变量值可以是 ...

  9. DOM查找元素

    1. 查找元素5种: 1. 按id查找1个元素对象: var elem=document.getElementById("id值"); 何时使用:1. 元素必须有id 2. 精确查 ...

随机推荐

  1. 洛谷—— P2330 [SCOI2005]繁忙的都市

    P2330 [SCOI2005]繁忙的都市 题目描述 城市C是一个非常繁忙的大都市,城市中的道路十分的拥挤,于是市长决定对其中的道路进行改造.城市C的道路是这样分布的:城市中有n个交叉路口,有些交叉路 ...

  2. codevs——1979 第K个数

    1979 第K个数  时间限制: 1 s  空间限制: 1000 KB  题目等级 : 黄金 Gold 题解       题目描述 Description 给定一个长度为N(0<n<=10 ...

  3. Windows下Redis的安装与部署

    1.下载地址:https://github.com/MSOpenTech/redis/releases 2.下载zip的包,下载后放到需要安装的目录进行解压操作,列如:F:\Redis\Redis-x ...

  4. Android: 阻止ScrollView随着数据加载自动滚动

    当ScrollView中有类似GridView的控件时,当数据加载后ScrollView会自动滚动.要阻止这种事情发生,我们需要做的是在ScrollView的下层容器中添加android:descen ...

  5. nodejs 安装express

    在命令行中执行 "npm install -g express"等待下载并且自动完成安装.测试express完成安装的一个方法就是查看其版本号,执行命令 “express -V”正 ...

  6. Python基础--webbrowser

    非常多人,一提到Python,想到的就是爬虫.我会一步一步的教你怎样爬出某个站点. 今天就先介绍一下webbrowser,这个词您肯定不会陌生.对,就是浏览器. 看看Python中对webbrowse ...

  7. LeetCode 648. Replace Words (单词替换)

    题目标签:HashMap 题目给了我们一个array 的 root, 让我们把sentence 里面得每一个word 去掉它得 successor. 把每一个root 存入hash set,然后遍历s ...

  8. 20170623_oracle_SQL

    ============SQL分类 数据定义语言(DDL):CREATE ALERT DROP TRUNCATE 数据操纵语言(DML):INSERT UPDATE DELETE SELECT 事务控 ...

  9. bzoj3175: [Tjoi2013]攻击装置&&4808: 马

    终于知道为啥网络流这么受欢迎了. 其实就是构个图模板一下的事儿,比较好打是吧. 然后这题网络流黑白染色(其实感觉上匈牙利更加直接好想啊,但是实际上黑白染色给人感觉就是二分图) st连白而ed连黑,流量 ...

  10. 【Codevs1288】埃及分数

    Position: http://codevs.cn/problem/1288/ Description 在古埃及,人们使用单位分数的和(形如1/a的, a是自然数)表示一切有理数. 如:2/3=1/ ...