javascript知识点之DOM与window对象
在学习javascript过程中只是一知半解好多,碰到自己不知道属性方法,到最后都不知道自己学到了什么 js代码为什么这样写 为什么你知道这方法或属性可以这样用。
DOM和window对象
DOM基本操作:
获得节点:
document:通过元素ID获取节点,标签,name属性
节点指针:获取元素首个子节点,最后一个,子节点列表,兄弟节点的前一个后一个,节点的父节点
节点操作:
创建节点:创建元素节点,属性节点,文本节点
插入节点:节点的子节点添加新的子节点 已有节点前插入新子节点
替换节点:将某个子节点替换另一个
复制节点:创建指定节点的副本
删除节点:删除指定的节点
属性操作:
获取属性:获取元素节点指定属性的属性值
设置属性:创建或改变元素节点的属性
删除属性:删除元素中指定属性
文本操作:
insertData(offset,String): 从offset指定的位置插入string
appendData(string): 将string插入到文本节点的末尾处
deleteDate(offset,count): 从offset起删除count个字符
replaceData(off,count,string): 从off经count个字符用string替代
splitData(offset): 从offset起将文本节点分成两个节点
substring(offset,count): 回由offset起的count个节点
----------------------------------------------------------------------------------------------------------------------------------------------------
window对象
navigator导航器对象:
appCodeName: 返回浏览器代码名
appName: 返回浏览器名称
appVersion: 返回浏览器的平台和版本信息
cookieEnabled: 返回浏览器是否启用cookie的布尔值
platform: 返回运行浏览器的操作系统平台
userAgent: 返回有客户机发送服务器的user-agent头部的值
screen显示器对象:
availHeight: 返回显示荧屏可用高度
availWidth: 返回显示荧屏可用宽度
height: 返回屏幕的像素高度
width: 返回屏幕的像素宽度
colorDepth: 返回屏幕颜色的位数
history历史对象
back(): 返回前一个URL
forward(): 返回后一个URL
go(): 返回某个具体页面
location位置对象
属性:
hash: 返回或设置从井号(#)开始的URL
host: 返回或设置主机名和当前URL的端口号
hostname: 当前URL的主机名
href: 完整URL
pathname: 当前URL的路径部分
port: 当前URL的端口号
protocol: 协议
search: 从问号(?)开始的URL
方法:
assign(URL): 加载新的文档
reload(): 重新加载当前页面
replace(newURL):用新文档替换当前文档
document文档对象
集合:
anchors[] imgaes,links,forms
描点对象数组,图片,连接,表单
属性:
cookie: 设置或返回当前文档有关的所有cookie
domain: 返回当前文档的域名
referrer: 返回载入当前文档的文档URL
title: 返回当前文档标题
URL: URL
方法:
open(): 打开一个新的文档,并擦除文档旧内容
close(): 关闭文档输入流
write(): 当前文档追加写入文本
writenln(): 与write()相同,在<pre>中追加换行
窗口控制:()
moveBy: moveBy(x,y)按照给定像素参数移动指定窗口
moveTo: moveTo(x,y)窗口移动的指定的坐标(x,y)处
resizeBy: resizeBy(水平,垂直)当前窗口改变指定大小
resizeTo: resizeTo(水平宽度,垂直宽度)
scrollBy: scrollBy(水平位移量,垂直位移量)参数正滚动负先滚动
scrollTo: 窗口内容滚动到指定位置
焦点控制:
focus:得到焦点
blur:失去焦点
打开关闭窗口:
open:
open("URL","窗口名称","窗口风格")
打开新的窗口并在窗口中装载指定URL地址网页
窗口风格:
height: 窗口高度 不能小于100
width: 宽度 不能小于100
left: 左坐标 不能为负值
top: 右 不能为负值
location: yes/no 是否显示地址
menubar: yes/no 是否显示菜单栏
resizable: yes/no 是否改变窗口大小
scrollbars: yes/no 是否允许出现滚动条
status: yes/no 是否显示状态栏
toolbar yes/no 是否工具栏
close:
close():指定关闭浏览器窗口
定时器:
setTimeout: 当前指定的毫秒数后,自动执行能代码
clearTimeout: 取消由setTimeout()设置的定时器
setInterval: 指定周期重复执行的功能代码
clearInterval:取消setInterval()设置的时间间隔器
对话框:
alert: 警告框
confirm: 确认框 确定返回true 取消返回false
prompt: 输入框 确定返回输入字符串 取消返回null值
属性:
状态栏:
defaultStatus 改变浏览器状态栏的默认显示
status 临时 改变浏览器状态栏的显示
窗口位置:
IE:
screenLeft 声明窗口左上角的X坐标
screenTop 声明窗口左上角的y坐标
document.body.scrollLeft 声明当前文档先右滚动
document.documentElement.scrollLeft 过的像素数
document.body.scrollTop 声明当前文档先下滚动
document.documentElement.scrollTop 过的像素数
!IE:
screenX 声明窗口左上角的X坐标
screenY 声明窗口左上角的y坐标
pageXOffset 声明当前文档向右滚动过的像素数
pageYOffset 声明当前文档向下滚动过的像素数
FF:
innerHeight 返回窗口的文档显示区的高度
innerWidth 宽度
outerHeight 返回窗口的外部高度
outerWidth 宽度
其他属性:
opener: 可以实现同域名下跨窗体之间的通讯一个窗体到另一个窗体的opener
closed: 当前窗口关闭返回true
name: 返回或设置窗口名称
self: 返回当前窗口的引用
javascript知识点之DOM与window对象的更多相关文章
- DOM、Window对象操作
一.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 一.基本语法: 数据类型(字符串,小数,整数,布尔,时间) var, v ...
- JavaScript 学习(1)--window对象
JavaScript 学习--Window对象 window对象方法 1.1 创建新窗体 //窗体打开 var newWindow=Window.open("default.html&quo ...
- (13)JavaScript之[HTML DOM元素][JS对象]
元素 /** * HTML DOM 元素(节点)*/ //创建新的HTML元素 var para = document.createElement('p'); var node = document. ...
- 黑马JavaScript学习一 BOM之Window对象定时器功能
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JavaScript权威指南--window对象
知识要点 window对象及其客户端javascript所扮演的核心角色:它是客户端javascript程序的全局对象.本章介绍window对象的属性和方法,这些属性定义了不同的API,但是只有一部分 ...
- 第十二章:window对象
第十一章介绍了window对象及其客户端javascript所扮演的核心角色:它是客户端javascript程序的全局对象.本章介绍window对象的属性和方法,这些属性定义了不同的API,但是只有一 ...
- JavaScript DOM编程基础精华01(DOM入门,DOM模型和获取页面元素,事件,window对象的方法)
DOM入门 DOM就是Html页面的模型,将每个标签都做为一个对象,JavaScript通过调用DOM中的属性.方法就可以对网页中的文本框.层等元素进行编程控制.比如通过操作文本框的DOM对象,就可以 ...
- JavaScript DOM编程基础精华02(window对象的属性,事件中的this,动态创建DOM,innerText和innerHTML)
window对象的属性1 window.location对象: window.location.href=‘’;//重新导航到新页面,可以取值,也可以赋值. window.location.reloa ...
- JavaScript 基础(三) - Date对象,RegExp对象,Math对象,Window 对象,History 对象,Location 对象,DOM 节点
Date对象 创建Date对象 //方法1:不指定参数 var date_obj = new Date(); alert(date_obj.toLocaleString()) //方法2:参数为日期字 ...
随机推荐
- 搭建Android开发环境。
1. 从 http://developer.android.com/intl/zh-cn/sdk/index.html 下载ADK 2. 点击SDK.Manager.exe, 遇到闪退的问题,一开始还 ...
- TypeScript Handbook 2——接口1(翻译)
接口(Interfaces) One of TypeScript's core principles is that type-checking focuses on the 'shape' that ...
- export a java project to runable jar
When a java project needs to be transfered to another machine, e.g. vps, we need to export it to a r ...
- C# 里的if/switch
今天又重新翻了翻C# Step by Step if 语句 if(bool 表达式) { 语句块: } else { 语句块: } switch(day) { case 0: dayName=&quo ...
- GoldenGate Studio 12.2.1.1发布
OGG studio是一款图形化OGG配置部署产品,其主要特性:1. 逻辑层面设计OGG,不需要了解OGG细节:2. 最值实践加快常用场景的配置:3. 使用拖拉映射,自动匹配源和目标对象:4. 一键部 ...
- 还有一个月,或者不到一个月就要期末了,复习ing
首先,线性代数,课程设计,php ,数据库,操作系统,还有概率论 ,四级
- mongodb php driver on windows
windows env: os:windows 10 soft: XAMPP for Windows 5.6.15 php version:5.6.15 Architecture:x86 Th ...
- mybatis学习2
解决字段名与实体类属性名不相同的冲突 1. 准备表和数据:CREATE TABLE orders(order_id INT PRIMARY KEY AUTO_INCREMENT,order_no VA ...
- Android基本布局
android基本布局有三种:LinearLayout,RelativeLayout,FrameLayout. 一.LinearLayout 1,这是一种垂直布局(或者水平布局),可以通过下面这一句来 ...
- Android自定义权限和使用权限
本文来自http://blog.csdn.net/liuxian13183/ ,引用必须注明出处! 自定义权限,主要用于保护被赋予权限的组件.如无权限与有权限,正如public与private的对类保 ...