2016.01.05 DOM笔记（一） 查找元素
DOM节点的种类
元素和标签是一个意思，例如<body>标签或者称为<body>元素
节点DOM的节点分为三类 元素节点，文本节点，属性节点
例如
<div id=‘box’>例子</div> 其中元素节点就是指这个div，文本节点就是指‘例子’这个文本，属性节点是指id
查找和定位节点
查找元素JS提供的几种方法：
- getElementsById()
document.getElementsById()
DOM操作必须要等到HTML文档加载完毕才能进行
怎样获取？
（1）把含有DOM操作的<script>标签移后
（2）使用onload事件
window.onload = function(){
//里面存放需要页面加载完毕后才要执行的代码
}
例如：
window.onload=function(){
var OneBox = document.getElementById('box');
} - OneBox.tagName 获取元素节点的标签名字
- OneBox.innerHTML 获取元素内的纯文本 注意纯文本的含意 包含HTML标签 是文本内容而不是文本节点
同时可以通过innerHTML来修改内容即进行赋值，而且此时可以解析HTML了而不再是纯文本的形式了
例如：OneBox.innerHTML='修炼<strong>JS</strong>'; - OneBox.id 获取id值
- OneBox.title 获取title值
- OneBox.style 获取style属性对象 如果想获取stley对象则需要类似这样获取：OneBox.style.css
- OneBox.className 获取css的class名字 即获取元素节点class属性的值
- OneBox.setAttribute('title','标题');创建一个属性和属性值
- getElementByTagName()
documet.getElementsByTagName()
例如HTML关于li标签的只有如下代码段：
<ul>
<li>示例1</li>
<li>示例2</li>
</ul>
使用
var OneLi = document.getElementsByTagName('li'); - OneLi就是一个带有li标签的HTML对象集合，利用OneLi[0]获取首个对象
- 同样有OneLi[0].innerHTML OneLi[0].tagName
ps:养成区分大小写的习惯 - getElementsByName()
- getElementsById()
2016.01.05 DOM笔记（一） 查找元素的更多相关文章
- 2016.01.07 DOM笔记（二） DOM节点
node节点属性 nodeName属性 oneBox= document.getElementsById('box');var s = oneBox.nodeName; //nodeName与tag ...
- DOM 之 document 查找元素方法
DOM 之 document 查找元素方法 getElementById("idName"); // 始终取得第一个 idName 的元素 getElementsByTagName ...
- JavaScript DOM操作之查找元素节点
概要: 编程接口 可通过 JavaScript 对 HTML DOM 进行访问. 所有 HTML 元素被定义为对象,而编程接口则是对象方法和对象属性. 方法是您能够执行的动作(比如添加或修改元素). ...
- extern “C”原理，用法以及使用场景-2016.01.05
1 问题提出 在编程过程中,经常发现如下用法: #ifndef _FILE_NAME_H_ #define _FILE_NAME_H_ #ifdef __cplusplus extern " ...
- jQuery使用（四）：DOM操作之查找兄弟元素和父级元素
查找兄弟元素 向下查找兄弟元素 next() nextAll() nextUntil() 向上查找兄弟元素 prev() prevAll() prevUntil() 查找所有兄弟元素 siblings ...
- C++笔记（7）——一些模拟题：简单模拟、查找元素、图形输出、日期处理、进制转换、字符串处理
以下内容基本来自<算法笔记>,作者为胡凡,建议直接买书看,我这里只是摘抄部分当笔记,不完整的. 简单模拟 就是一类"题目怎么说你就怎么做"的题目.这类题目不涉及算法,只 ...
- 058 01 Android 零基础入门 01 Java基础语法 06 Java一维数组 05 案例：求数组元素的最大值
058 01 Android 零基础入门 01 Java基础语法 06 Java一维数组 05 案例:求数组元素的最大值 本文知识点:求数组元素的最大值 案例:求数组元素的最大值 程序代码及其执行过程 ...
- 011 01 Android 零基础入门 01 Java基础语法 02 Java常量与变量 05 变量的三个元素的详细介绍之三—— 变量值——即Java中的“字面值”
011 01 Android 零基础入门 01 Java基础语法 02 Java常量与变量 05 变量的三个元素的详细介绍之三-- 变量值--即Java中的"字面值" 变量值可以是 ...
- DOM查找元素
1. 查找元素5种: 1. 按id查找1个元素对象: var elem=document.getElementById("id值"); 何时使用:1. 元素必须有id 2. 精确查 ...
随机推荐
- codevs——1462 素数和
1462 素数和 时间限制: 1 s 空间限制: 64000 KB 题目等级 : 青铜 Bronze 题解 题目描述 Description 给定2个整数a,b 求出它们之间(不含a ...
- Mysql 使用delete drop truncate 删除数据时受外键约束影响解决方案
先禁用数据库的外键约束: set foreign_key_checks=0; 进行删除操作 delete.drop.truncate 恢复数据库外键约束: set foreign_key_checks ...
- Linux服务管理（Ubuntu服务管理工具sysv-rc-conf）（转）
Linux运行级别 Linux系统任何时候都运行在一个指定的运行级上,并且不同的运行级的程序和服务都不同,所要完成的工作和要达到的目的都不同,系统可以在这些运行级之间进行切换,以完成不同的工作. 运行 ...
- dota监測
执行环境:win7 32位. python版本号:3.4.1 因为用到了一些win32api,这些并不是python标准库自带的,所以你须要先去下载pywin32模块.去http://sourcefo ...
- JAVA学习第四十一课 — 泛型的基本应用（一）
泛型是JDK1.5以后出现的安全机制,简化机制,提高安全性 泛型的长处 1.将执行时出现的问题ClassCastException转移到了编译时期 2.避免了强制转换的麻烦 <>在当操作的 ...
- 行香子·过尽千山
<行香子·过尽千山> 文/天地尘埃2020 过尽千山.水瘦山寒. 思来路.地咽天玄. 千金散尽,欲补穹天. 但孟春暖,仲春炫.暮春喧. 三皇五帝,魏武挥鞭. 朴无欲.衡玉玑璿. 金生丽水, ...
- es6 Object.assign ECMAScript 6 笔记（六） ECMAScript 6 笔记（一） react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式
es6 Object.assign 目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...
- hive学习笔记-表操作
Hive数据类型 基本数据类型 tinyint,smallint,int,biging,float,double,decimal,char,varchar,string,binary,boolean, ...
- UIViewController 专题
呵呵 轻轻巧巧 UIViewController self setNeedsStatusBarAppearanceUpdate 刷新状态栏 (内部会重新调用 prefersStatusBarHi ...
- Music information retrieval
Music information retrieval - Wikipedia https://en.wikipedia.org/wiki/Music_information_retrieval Mu ...