javascript中阶
dada678
这个作者很懒,什么都没留下…
展开
-
9-1认识DOM
文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法。DOM 将HTML文档呈现为带有元素、属性和文本的树结构(节点树)。先来看看下面代码:将HTML代码分解为DOM节点层次图:HTML文档可以说由节点构成的集合,DOM节点有:1. 元素节点:上图中、、等都是元素节点,即标签。2. 文本节点:向转载 2016-06-30 16:22:08 · 254 阅读 · 0 评论 -
9-20网页尺寸scrollHeight
scrollHeight和scrollWidth,获取网页内容高度和宽度。一、针对IE、Opera:scrollHeight 是网页内容实际高度,可以小于 clientHeight。二、针对NS、FF:scrollHeight 是网页内容高度,不过最小值是 clientHeight。也就是说网页内容实际高度小于 clientHeight 时,scrollHeight转载 2016-06-30 17:58:37 · 226 阅读 · 0 评论 -
9-21网页尺寸offsetHeight
offsetHeight和offsetWidth,获取网页内容高度和宽度(包括滚动条等边线,会随窗口的显示大小改变)。一、值offsetHeight = clientHeight + 滚动条 + 边框。二、浏览器兼容性var w= document.documentElement.offsetWidth || document.body.offsetWidt转载 2016-06-30 17:59:46 · 210 阅读 · 0 评论 -
第6章 事件响应,让网页交互
什么是事件JavaScript 创建动态页面。事件是可以被 JavaScript 侦测到的行为。 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。比如说,当用户单击按钮或者提交表单数据时,就发生一个鼠标单击(onclick)事件,需要浏览器做出处理,返回给用户一个结果。主要事件表:鼠标单击事件( onclick转载 2016-06-21 08:11:04 · 205 阅读 · 0 评论 -
7-1什么是对象 Date
什么是对象JavaScript 中的所有事物都是对象,如:字符串、数值、数组、函数等,每个对象带有属性和方法。对象的属性:反映该对象某些特定的性质的,如:字符串的长度、图像的长宽等;对象的方法:能够在对象上执行的动作。例如,表单的“提交”(Submit),时间的“获取”(getYear)等;JavaScript 提供多个内建对象,比如 String、Date转载 2016-06-21 08:45:34 · 254 阅读 · 0 评论 -
7-2字符串
String 字符串对象在之前的学习中已经使用字符串对象了,定义字符串的方法就是直接赋值。比如:var mystr = "I love JavaScript!"定义mystr字符串后,我们就可以访问它的属性和方法。访问字符串对象的属性length:stringObject.length; 返回该字符串的长度。var mystr="Hello Wo转载 2016-06-21 08:55:40 · 1308 阅读 · 0 评论 -
7-3Math对象
Math对象,提供对数据的数学计算。使用 Math 的属性和方法,代码如下: var mypi=Math.PI; var myabs=Math.abs(-15); document.write(mypi); document.write(myabs);运行结果:3.14159265358979315注意:Math 对象是一个固有转载 2016-06-21 09:13:53 · 126 阅读 · 0 评论 -
7-3数组
Array 数组对象数组对象是一个对象的集合,里边的对象可以是不同类型的。数组的每一个成员对象都有一个“下标”,用来表示它在数组中的位置,是从零开始的数组定义的方法:1. 定义了一个空数组:var 数组名= new Array();2. 定义时指定有n个空元素的数组:var 数组名 =new Array(n);3.定义数组的时候,直接初始化转载 2016-06-21 09:21:28 · 228 阅读 · 0 评论 -
第8章 浏览器对象
window对象window对象是BOM的核心,window对象指当前的浏览器窗口。window对象方法:注意:在JavaScript基础篇中,已讲解了部分属性,window对象重点讲解计时器。JavaScript 计时器在JavaScript中,我们可以在设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行。计时器类型:一次性转载 2016-06-21 10:32:38 · 157 阅读 · 0 评论 -
8-7History 对象
history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能。注意:从窗口被打开的那一刻开始记录,每个浏览器窗口、每个标签页乃至每个框架,都有自己的history对象与特定的window对象关联。语法:window.history.[属性|方法]注意:window可以省略。History 对象属性History转载 2016-06-21 11:02:15 · 186 阅读 · 0 评论 -
8-12Navigator对象
Navigator 对象包含有关浏览器的信息,通常用于检测浏览器与操作系统的版本。对象属性:查看浏览器的名称和版本,代码如下: var browser=navigator.appName; var b_version=navigator.appVersion; document.write("Browser name"+browser); doc转载 2016-06-21 11:11:10 · 183 阅读 · 0 评论 -
8-13userAgent
返回用户代理头的字符串表示(就是包括浏览器版本信息等的字符串)语法navigator.userAgent几种浏览的user_agent.,像360的兼容模式用的是IE、极速模式用的是chrom的内核。使用userAgent判断使用的是什么浏览器(假设使用的是IE8浏览器),代码如下:function validB(){ var u_agent = na转载 2016-06-21 11:14:36 · 132 阅读 · 0 评论 -
screen对象
screen对象用于获取用户的屏幕信息。语法:window.screen.属性对象属性:屏幕分辨率的高和宽window.screen 对象包含有关用户屏幕的信息。1. screen.height 返回屏幕分辨率的高2. screen.width 返回屏幕分辨率的宽注意:1.单位以像素计。2. window.screen 对转载 2016-06-21 11:17:45 · 337 阅读 · 0 评论 -
9-18浏览器窗口可视区域大小
获得浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条)的方法:一、对于IE9+、Chrome、Firefox、Opera 以及 Safari:• window.innerHeight - 浏览器窗口的内部高度• window.innerWidth - 浏览器窗口的内部宽度二、对于 Internet Explorer 8、7、6、5:• docume转载 2016-06-30 17:58:02 · 185 阅读 · 0 评论 -
9-17创建文本节点createTextNode
createTextNode() 方法创建新的文本节点,返回新创建的 Text 节点。语法:document.createTextNode(data)参数:data : 字符串值,可规定此节点的文本。我们来创建一个元素并向其中添加一条消息,代码如下:运行结果:转载 2016-06-30 17:57:22 · 516 阅读 · 0 评论 -
9-2getElementsByName()方法
返回带有指定名称的节点对象的集合。语法:document.getElementsByName(name)与getElementById() 方法不同的是,通过元素的 name 属性查询元素,而不是通过 id 属性。注意:1. 因为文档中的 name 属性可能不唯一,所有 getElementsByName() 方法返回的是元素的数组,而不是一个元素。转载 2016-06-30 16:23:01 · 343 阅读 · 0 评论 -
9-3getElementsByTagName()方法
返回带有指定标签名的节点对象的集合。返回元素的顺序是它们在文档中的顺序。语法:getElementsByTagName(Tagname)说明:1. Tagname是标签的名称,如p、a、img等标签名。2. 和数组类似也有length属性,可以和访问数组一样的方法来访问,所以从0开始。看看下面代码,通过getElementsByTagName()转载 2016-06-30 16:24:58 · 211 阅读 · 0 评论 -
9-5getAttribute()方法、setAttribute()方法
通过元素节点的属性名称获取属性的值。语法:elementNode.getAttribute(name)说明:1. elementNode:使用getElementById()、getElementsByTagName()等方法,获取到的元素节点。2. name:要想查询的元素节点的属性名字看看下面的代码,获取h1标签的属性值:运行结果:转载 2016-06-30 16:54:59 · 256 阅读 · 0 评论 -
9-7节点属性
在文档对象模型 (DOM) 中,每个节点都是一个对象。DOM 节点有三个重要的属性 :1. nodeName : 节点的名称2. nodeValue :节点的值3. nodeType :节点的类型一、nodeName 属性: 节点的名称,是只读的。1. 元素节点的 nodeName 与标签名相同2. 属性节点的 nodeName 是属性的名称3. 文转载 2016-06-30 17:08:57 · 197 阅读 · 0 评论 -
9-8访问子结点childNodes
访问选定元素节点下的所有子节点的列表,返回的值可以看作是一个数组,他具有length属性。语法:elementNode.childNodes注意:如果选定的节点没有子节点,则该属性返回不包含节点的 NodeList。我们来看看下面的代码:运行结果:IE: UL子节点个数:3 节点类型:1其它浏览器: UL子节点个转载 2016-06-30 17:21:52 · 253 阅读 · 0 评论 -
9-9访问子结点的第一和最后项
一、firstChild 属性返回‘childNodes’数组的第一个子节点。如果选定的节点没有子节点,则该属性返回 NULL。语法:node.firstChild说明:与elementNode.childNodes[0]是同样的效果。 二、 lastChild 属性返回‘childNodes’数组的最后一个子节点。如果选定的节点没有子节点,则该属性返回 NUL转载 2016-06-30 17:43:26 · 348 阅读 · 0 评论 -
9-9访问父节点parentNode
获取指定节点的父节点语法:elementNode.parentNode注意:父节点只能有一个。看看下面的例子,获取 P 节点的父节点,代码如下: parentNode 获取指点节点的父节点 var mynode= document.getElementById("con"); document.write(mynode.parentNode.no转载 2016-06-30 17:45:57 · 279 阅读 · 0 评论 -
9-11访问兄弟节点
1. nextSibling 属性可返回某个节点之后紧跟的节点(处于同一树层级中)。语法:nodeObject.nextSibling说明:如果无此节点,则该属性返回 null。2. previousSibling 属性可返回某个节点之前紧跟的节点(处于同一树层级中)。语法:nodeObject.previousSibling 说明:如果无此节点,转载 2016-06-30 17:47:53 · 216 阅读 · 0 评论 -
9-12插入节点appendChild()
在指定节点的最后一个子节点列表之后添加一个新的子节点。语法:appendChild(newnode)参数:newnode:指定追加的节点。我们来看看,div标签内创建一个新的 P 标签,代码如下:运行结果:HTMLJavaScriptThis is a new p转载 2016-06-30 17:50:26 · 260 阅读 · 0 评论 -
9-14插入节点insertBefore()
insertBefore() 方法可在已有的子节点前插入一个新的子节点。语法:insertBefore(newnode,node);参数:newnode: 要插入的新节点。node: 指定此节点前插入节点。我们在来看看下面代码,在指定节点前插入节点。运行结果:This is a new pJavaScriptHTML转载 2016-06-30 17:51:18 · 553 阅读 · 0 评论 -
9-15删除节点removeChild()
removeChild() 方法从子节点列表中删除某个节点。如删除成功,此方法可返回被删除的节点,如失败,则返回 NULL。语法:nodeObject.removeChild(node)参数:node :必需,指定需要删除的节点。我们来看看下面代码,删除子点。运行结果:HTML删除节点的内容: javascript注意: 把删除的子转载 2016-06-30 17:51:52 · 316 阅读 · 0 评论 -
9-16替换元素节点replaceChild()
replaceChild 实现子节点(对象)的替换。返回被替换对象的引用。 语法:node.replaceChild (newnode,oldnew ) 参数:newnode : 必需,用于替换 oldnew 的对象。 oldnew : 必需,被 newnode 替换的对象。我们来看看下面的代码: 效果: 将文档中的 Java 改为 Java转载 2016-06-30 17:52:31 · 266 阅读 · 0 评论 -
9-17创建元素节点createElement
createElement()方法可创建元素节点。此方法可返回一个 Element 对象。语法:document.createElement(tagName)参数:tagName:字符串值,这个字符串用来指明创建元素的类型。注意:要与appendChild() 或 insertBefore()方法联合使用,将元素显示在页面中。我们来创建一个按钮,代码转载 2016-06-30 17:53:20 · 232 阅读 · 0 评论 -
8-27练习
制作一个跳转提示页面:要求:1. 如果打开该页面后,如果不做任何操作则5秒后自动跳转到一个新的地址,如慕课网主页。2. 如果点击“返回”按钮则返回前一个页面。效果:注意: 在窗口中运行该程序时,该窗口一定要有历史浏览记录,否则"返回"无效果。代码: 浏览器对象转载 2016-06-21 11:24:44 · 298 阅读 · 0 评论