document对象

每个载入浏览器的 HTML 文档都会成为 Document 对象。document 对象是HTML文档的根节点与所有其他节点(元素节点,文本节点,属性节点, 注释节点)。Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。

<body>
<div id="h">
<div></div>
<span></span>
</div>
<div id="l"></div>
<div class="haha"></div>
<div class="haha"></div>
<span class="haha"></span>
<input type="text" name="dada" />
</body> <script>
//var a=document.getElementById("l");
//a.childNodes
//alert(a.previousSibling) 找到同级
/*alert(a.childNodes[5]);*///找子节点的时候的时候除了找标签还会找空格
/*alert(a.firstChild)*///返回文档的首个子节点
/*alert(a.parentNode)*///找到该元素的父级元素
/*alert(a)*///找到的只有一个
/*var b=document.getElementsByClassName("haha");//找到的是多个,返回一个数组
alert(b[2]);*/
/*var c=document.getElementsByTagName("div")//根据标签名找,找到的是多个,返回一个数组
alert(c[0])
/*var d=document.getElementsByName("dada")
alert(d[0])根据name找,可以找到多个,返回数组,主要针对表单元素。*/

操作样式
var a=document.getElementById("h")
a.style.backgroundColor="red"
alert(a.style.backgroundColor)
a.style.width="" 属性值为空的时候就是删除了样式
<div id="aaa"> <span>hahaha</span>
</div> </body>
<script>
//document整个文档 //控制元素
//var a=document.getElementById("aaa") /*a.remove()*/; //移除元素,移除只是在浏览器显示页面移除了。
//var bb=document.createElement("span")
//a.appendChild(bb) //追加子元素 //操作元素
//var a=document.getElementById("aaa");
/*alert(a.innerText) */ //innerText 取元素中的文本内容
a.innerText="world" //给元素赋文本值
//alert(a.innerHTML) //区元素的HTML代码内容
//a.innerHTML="" //给元素放一个HTML代码 表单元素
/*var a=document.getElementById()
a.value="yonghuming";//给元素赋值
alert(a.value);*///取值 操作属性
var a=document.getElementById("aaa");
a.setAttribute("bs","100") ////给标签加属性、属性
a.getAttribute("bs") //获取属性值
a.removeAttribute("bs") // 移除属性
/*var a=document.getElementById("aaa");
a.setAttribute("bs","200");*/
//alert(a.getAttribute("bs"));

  

/*鼠标事件
onclick 鼠标单击触发
ondblclick 鼠标双击触发
onmouseover 鼠标移上去触发
onmouseour 鼠标离开触发
onmousemove 鼠标移动触发*/

/*键盘事件:
onkeydown 键盘按下触发
onkeyup 按键抬起触发
onkeypress 按键触发*/

/*表单元素事件
onfocus 获得焦点出发
onblur 失去焦点触发
onchange 内容改变的时候触发
*/
//JS不支持统一加事件,但是可以通过循环加事件

浅尝JavaScript document对象的更多相关文章

  1. javaScript document对象详解

    Document对象内容集合 document 文挡对象 - JavaScript脚本语言描述———————————————————————注:页面上元素name属性和JavaScript引用的名称必 ...

  2. javascript document对象 第21节

    <html> <head> <title>DOM对象</title> <style type="text/css"> t ...

  3. 详解JavaScript Document对象

    转自:http://segmentfault.com/a/1190000000660947 在浏览器中,与用户进行数据交换都是通过客户端的javascript代码来实现的,而完成这些交互工作大多数是d ...

  4. JavaScript document对象

    1.document对象是window对象的子对象,可直接使用,多用于获取HTML页面元素 2.document对象属性 a) alinkColor活动链接颜色 b) linkColor文本链接颜色 ...

  5. 浅谈JavaScript原型对象与相关设计模式

    引言 本文先从介绍JavaScript中基本的几种设计模式开始,最后引出原型对象,然后对原型对象有一个较全面的介绍. 1.创建对象的几种设计模式 A.工厂模式 我们知道在JavaScript中创建对象 ...

  6. 14 JavaScript Window对象

    Window对象表示一个浏览器窗口或者一个框架. 在客户端JavaScript中,window对象是全局对象,所有的表达式都在当前的环境中计算. Window对象的子对象: JavaScript do ...

  7. javascript获取iframe框架中页面document对象,获取子页面里面的内容,iframe获取父页面的元素,

    javascript获取iframe框架中,加载的页面document对象 因为浏览器安全限制,对跨域访问的页面,其document对象无法读取.设置属性 function getDocument(i ...

  8. 【温故而知新-Javascript】使用 Document 对象

    Document 对象时通往DOM功能的入口,它向你提供了当前文档的信息,以及一组可供探索.导航.搜索或操作结构与内容的功能. 我们通过全局变量document访问Document对象,它是浏览器为我 ...

  9. javascript之document对象

    一.修改网页元素 当使用document提供的方法和Element的属性得到网页元素之后,就可以对元素的内容进行修改,如下例所示的“全选/全不选”的实现. 例3-17 <html> < ...

随机推荐

  1. cas 代理认证配置

    注:本文转自http://www.ichatter.net/2013/03/21/385/ CAS(Central Authentication Service)框架是一个开源的单点登陆框架.最近公司 ...

  2. Tomcat 热部署

    Tomcat热部署就是实现不停机的发布项目和更新项目 1.修改conf目录下的tomcat-users.xml文件 在<tomcat-user>添加如下配置 [root@localhost ...

  3. 'k1': 大于66的所有值, 'k2': 小于66的所有值

    #!/usr/bin/env python # -*- coding: utf-8 -*- #有如下值集合 [11,22,33,44,55,66,77,88,99,90...],将所有大于 66 的值 ...

  4. O(mn)实现LCIS

    序: LCIS即求两序列的最长公共不下降子序列.思路于LCS基本一致. 用dp[i][j]记录当前最大值. 代码实现: /* About: LCIS O(mn) Auther: kongse_qi D ...

  5. copyWithZone 的使用方法

    1.简单复制只能实现浅拷贝:指针赋值,使两个指针指向相同的一块内存空间,操作不安全. 2. Foundation类已经遵守了<NSCopying>和 <NSMutableCopyin ...

  6. ural 1297. Palindrome

    题目链接:http://acm.timus.ru/problem.aspx?space=1&num=1297 求最长回文子串 典型的后缀数组的入门题目,但是可以用更简单的方法解决,毕竟数据量比 ...

  7. XSHELL工具上传文件到Linux以及下载文件到本地(Windows)

    Xshell很好用,然后有时候想在windows和linux上传或下载某个文件,其实有个很简单的方法就是rz,sz.首先你的Linux上需要安装安装lrzsz工具包,(如果没有安装请执行以下命令,安装 ...

  8. 通过分析 JDK 源代码研究 TreeMap 红黑树算法实

    TreeMap和TreeSet是Java Collection Framework的两个重要成员,其中TreeMap是Map接口的常用实现类,而TreeSet是Set接口的常用实现类.虽然HashMa ...

  9. (转载)sizeof

    [C++专题]C++ sizeof 使用规则及陷阱分析   摘要:鉴于sizeof为各大软件公司笔试.面试必考题,现收集sizeof的各种用法,尽量做到全面理解,其中例子希望能举一反三.提示:下文例子 ...

  10. python通过http请求发送soap报文进行webservice接口调用

    最近学习Python调用webservice 接口,开始的时候主要采用suds 的方式生产client调用,后来发现公司的短信接口采用的是soap报文来调用的,然后开始了谷歌,最后采用httplib ...