JS框架frame模板

1、1 frame 属性可设置或返回表格的外部边框。语法 tableObject.frame=void|above|below|hsides|vsides|lhs|rhs|box|border 实例下面的例子设置了表格的两种不同的边框：function aboveFrames()document.getElementById(myTable).frame=abovefunction belowFrames()document.getElementById(myTable).frame=below1002003004002 frameBorder 属性设置或返回是否显示框架周围的边框。如果不希望出现

2、框架的边框，请把该属性设置为 0 。语法frameObject.frameBorder=1|0实例在我们的例子中， 首先将创建包含带有两个列的框架集的 HTML 文档。每列设置 为浏览器窗口的 50%：HTML 文档 frame_frameborder.htm 被放入第一列，而 HTML 文档 frame_a.htm 被放入第二列。下面是 frame_frameborder.htm 的源代码： x=parent.document.getElementById(leftFrame); y=parent.document.getElementById(rightFrame);document.wr

3、ite(Frame border for leftFrame is: ); document.write(x.frameBorder);document.write(Frame border for rightFrame is: ); document.write(y.frameBorder);3 frameBorder 属性可设置或返回是否显示 iframe 周围的边框。 把该属性设置为 0 ，可以获得无边框的框架。语法iframeObject.frameBorder=1|0实例本例可设置 iframe 是否拥有边框：function removeBorder()document.getEl

4、ementById(frame1).frameBorder=0;function restoreBorder()document.getElementById(frame1).frameBorder=1;4 getContext() 方法返回一个用于在画布上绘图的环境。语法Canvas.getContext( contextID )参数参数 contextID 指定了您想要在画布上绘制的类型。当前唯一的合法值是2d ，它指定了二维绘图， 并且导致这个方法返回一个环境对象， 该对象导出一 个二维绘图 API 。提示：在未来，如果 标签扩展到支持 3D 绘图， getContext() 方法 可能

5、允许传递一个 3d 字符串参数。返回值一个 CanvasRenderingContext2D 对象，使用它可以绘制到 Canvas 元素中。描述返回一个表示用来绘制的环境类型的环境。 其本意是要为不同的绘制类型 (2 维、 3 维)提供不同的环境。当前，唯一支持的是 2d ，它返回一个 CanvasRenderingContext2D 对象，该对象实现了一个画布所使用的大多数方法。5 getElementById() 方法可返回对拥有指定 ID 的第一个对象的引用。语法document.getElementById(id)说明HTML DOM定 义了多种查找元素的方法，除了 getElemen

6、tById() 之外，还有 getElementsByName() 和 getElementsByTagName() 。不过，如果您需要查找文档中的一个特定的元素，最有效的方法是 getElementById() 。在操作文档的一个特定的元素时， 最好给该元素一个 id 属性，为它指定一个(在 文档中)唯一的名称，然后就可以用该 ID 查找想要的元素。实例例子 1function getValue()var x=document.getElementById(myHeader)alert(x.innerHTML)This is a headerClick on the header to al

7、ert its value例子 2getElementById() 是一个重要的方法，在 DOM 程序设计中，它的使用非常常见。 我们为您定义了一个工具函数，这样您就可以通过一个较短的名字来使用 getElementById() 方法了：function id(x) if (typeof x = string) return document.getElementById(x);return x;上面这个函数接受元素 ID 作为它们的参数。 对于每个这样的参数， 您只要在使 用前编写 x = id(x) 就可以了。6 getElementsByName() 方法可返回带有指定名称的对象的集合。

8、语法document.getElementsByName(name)该方法与 getElementById() 方法相似， 但是它查询元素的 name 属性，而不是 id 属性。另外，因为一个文档中的 name 属性可能不唯一 (如 HTML 表单中的单选按钮通 常具有相同的 name 属性)，所有 getElementsByName() 方法返回的是元素的 数组，而不是一个元素。实例function getElements()var x=document.getElementsByName(myInput);alert(x.length);7 getElementsByTagName() 方

9、法可返回带有指定标签名的对象的集合。语法document.getElementsByTagName(tagname)说明 getElementsByTagName() 方法返回元素的顺序是它们在文档中的顺序。 如果把特殊字符串 * 传递给 getElementsByTagName() 方法，它将返回文档 中所有元素的列表，元素排列的顺序就是它们在文档中的顺序。提示和注释注释：传递给 getElementsByTagName() 方法的字符串可以不区分大小写。实例例子 1function getElements()var x=document.getElementsByTagName(input

10、);alert(x.length);例子 2可以用 getElementsByTagName() 方法获取任何类型的 HTML 元素的列表。例 如，下面的代码可获取文档中所有的表：var tables = document.getElementsByTagName(table); alert (This document contains + tables.length + tables);例子 3如果您非常了解文档的结构， 也可以使用 getElementsByTagName() 方法获取文 档中的一个特定的元素。例如，下面的代码可以获得文档中的第四个段落：var myParagragh =

11、 document.getElementsByTagName(p)3;不过，我们还是认为， 如果您需要操作某个特定的元素， 使用 getElementById() 方法将更为有效。8 globalCompositeOperation 属性说明如何在画布上组合颜色。语法CanvasRenderingContext2D.globalCompositeOperation描述globalCompositeOperation 属性说明了绘制到画布上的颜色是如何与画布上已 有的颜色组合(或“合成”)的。下面的表格列出了可能的值及其含义。 这些值中的 source 一词，指的是将要 绘制到画布上的颜色，而

12、destination 指的是画布上已经存在的颜色。默认值是 source-over。值 copy darker含义只绘制新图形，删除其他所有内容。 在图形重叠的地方，颜色由两个颜色值相减后决定。destination-atop已有的内容只有在它和新的图形重叠的地方保留。新图形 绘制于内容之后。destination-in在新图形以及已有画布重叠的地方，已有内容都保留。所 有其他内容成为透明的。destination-out在已有内容和新图形不重叠的地方，已有内容保留。所有 其他内容成为透明。destination-overlightersource-atopsource-in新图形绘制于已有

13、内容的后面。在图形重叠的地方，颜色由两种颜色值的加值来决定。只有在新图形和已有内容重叠的地方，才绘制新图形。 在新图形以及已有内容重叠的地方，新图形才绘制。所有其他内容成为透明。source-out source-over xor只有在和已有图形不重叠的地方，才绘制新图形。新图形绘制于已有图形的顶部。这是默认的行为。 在重叠和正常绘制的其他地方，图形都成为透明的。提示和注释注释： FireFox 1.5不支持 copy 值或 darker9 go() 方法可加载历史列表中的某个具体的页面。语法history.go(number|URL)说明URL 参数使用的是要访问的 URL，或 URL 的子

14、串。而 number 参数使用的是要 访问的 URL 在 History 的 URL 列表中的相对位置。实例下面例子会加载历史列表中的前一个页面：function goBack()window.history.go(-1) 10 hash 属性可设置或返回一个区域中 URL 的锚部分语法areaObject.hash=anchorname实例下面的例子可把 URL 的锚部分 #top 更改为 #bottom ：function changeLink()document.getElementById(venus).hash=bottom11 height 属性可设置或返回 iframe 的高度（

15、以像素或百分比为单位）语法iframeObject.height=pixels实例下面的例子可更改 iframe 的高度： function changeHeight()document.getElementById(frame1).height=200; 12 height 属性可设置或返回图像的高度。语法imageObject.height=pixels实例下面的例子可设置图像的高度和宽度：function changeSize()document.getElementById(compman).height=250document.getElementById(compman).widt

16、h=30013 height 属性声明了显示浏览器的屏幕的高度，以像素计语法screen.height实例 document.write(Height: ) document.write(screen.height + )14 height 属性设置元素的高度。语法：Object.style.height=auto|length|%可能的值值 描述auto 默认。浏览器会计算出实际的高度。 length 使用 px 、cm 等单位定义高度。% 基于其包含块的百分比高度。实例本例设置按钮的高度：function setHeight() document.getElementById(b1).st

17、yle.height=50px; 15 host 属性可设置或返回 URL 的主机名和端口。语法areaObject.host=host实例下面的例子可返回 Venus 区域的主机名和端口： The hostname and port for the Venus area are: x=document.getElementById(venus); document.write(x.host); 16 host 属性是一个可读可写的字符串，可设置或返回当前 URL 的主机名称和 端口号。语法location.host假设当前的 URL 是: :1234/tes

18、t.htm#part2 document.write(location.host);输出：:123417 hostname 属性是一个可读可写的字符串， 可设置或返回当前 URL 的主机名语法location.hostname实例假设当前的 URL 是:.com:1234/test.htm#part2 ： document.write(location.hostname);输出：18 href 属性可设置或返回被链资源的 URL。语法anchorObject.href=URL实例面的例子将更改一个链接的文本、 URL 以及 targetfunctio

19、n changeLink() document.getElementById(myAnchor).innerHTML=W3School; document.getElementById(myAnchor).href=document.getElementById(myAnchor).target=_blank;Microsoft 18 href 属性可设置或返回图像映射中链接的 URL。语法areaObject.href=URL实例下面的例子讲更改图像映射中某个区域的链接：function changeLink() document.getEl

20、ementById(venus).href= 19 href 属性可设置或返回页面中所有链接的基准 URL。语法baseObject.href=URL实例下面的例子可返回基准 URL： Base URL: x=document.getElementById(myBaseId);document.write(x.href);输出：Base URL: /htmldom/20 The href property sets or returns the URL of the linked resourc

21、e.语法linkObject.href=URL实例The following example changes style sheet:function changeStyle()document.getElementById(style1).href=try_dom_link2.css21 href 属性是一个可读可写的字符串，可设置或返回当前显示的文档的完整 URL。因此，我们可以通过为该属性设置新的 URL，使浏览器读取并显示新的 URL 的 内容。语法location.href=URL实例假设当前的 URL 是: :1234/test.htm#part2 document.write(location.href);输出：:1234/test.htm#part222 hreflang 属性可设置或返回被链资源的语言代码。语法anchorObject.hreflang=languagecode下面的例子将返回被链资源的语言代码：W3Sx=document.getElementById(myAnchor);document.write(x.hreflang);23 The hrefla