快速学习js 笔记六 dom的 body 、frameset 、frame

最新推荐文章于 2022-06-13 17:17:29 发布

studypower

最新推荐文章于 2022-06-13 17:17:29 发布

阅读量850

点赞数

分类专栏： js 文章标签： js JS Js

本文链接：https://blog.csdn.net/work888study/article/details/8569036

版权

js 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

1、body的元素 其常用属性 有

1）className 在设置body的css的时候常用

2）id 该对象唯一标识

3）dir 文本的显示方向

4）lang 语言

5) style

注：上面的属性是 dom 的对象的标准属性，基本所有的标签对象都这些属性。

<html>
<head>
 <head>
<script type="text/javascript">

   function test(){
   var txt=document.open("text/html","replace");
   
   txt.write("<html><body  id='test'>右边到左边</body></html>");
   txt.all["test"].dir="rtl";
   txt.close();
}
</script>

<body id="test"  dir="ltr">
<input  type="button" value="改变body的显示方向" οnclick="test()"/>
  <script type="text/javascript">
   document.write("从左边显示到右边");
  </script>
  <body>
</html>

2、布局对象 frameset

1) cols : 列数

2）rows : 行数

3）id: 唯一标识

单击子页面的按钮改变frameset 的布局

frameset.hml

<html>

<frameset  id ="frm1" cols="50%,50%"  >

<frame src="frame1.html" />

<frame src="frame2.html" />

</frameset></html>

frame1.html frame2.html

<html>
<head>
</head>
<script type="text/javascript">
function change()
{
  window.parent.document.getElementById("frm1").cols="25%,75%";
}
</script>
<body>
<input  type="button" value="修改布局" οnclick="change()">
</body>
</html>

3、frame

1) frameBoder 是否有边框 0 无 1有

2）marginWidth 、marginHeight frame 周围的空白。

3）src frame中显示的文档的url

4）onResize frame的框架大小是否允许调整 true|false

5）scorlling 是否有滚动条 yes|on

6) id 、name

frameset.html

<html>
<frameset  id ="frm1" cols="50%,50%"  >
<frame  id="frame1"  onResize="true" frameBorder="1" src="frame1.html" />
<frame  id="frame2"  onResize="true" frameBorder="1" src="frame2.html" />
</frameset>
</html>

frame1.html frame2.html

 <html>
<head>
</head>
<script type="text/javascript">
function change()
{
 var frame1=  window.parent.document.getElementById("frame1");
 frame1.onResize=false;
 frame1.name="frame1";
 
   window.parent.document.getElementById("frame2").frameBorder="1";
}
</script>
<body>
<input  type="button" value="修改布局" οnclick="change()">
</body>
</html>