文档对象（1）

最新推荐文章于 2021-06-06 23:16:56 发布

boat_sea

最新推荐文章于 2021-06-06 23:16:56 发布

阅读量474

点赞数

文章标签： js

本文链接：https://blog.csdn.net/boat_sea/article/details/80170476

版权

文档对象的常用属性

Document对象的常用属性及说明
alinkColor	链接文字被单击时的颜色，对应<body>标记中的alink属性
all[]	存储HTML标记的一个数组（该属性本身也是一个对象）
bgColor	文档的背景颜色，对应<body>标记中的bgcolor属性
fgColor	文档的文本颜色（不包含超链接的文字），对应<body>标记中的text属性值
forms[]	存储窗体对象的文本颜色(不包含超链接的文字),对应<body>标记中的text属性值
images[]	存储图像对象的一个数组（该属性本身也是一个对象）
linkColor	未被访问的链接文字的颜色，对应<body>标记的link属性
links[]	存储link对象的一个数组（该属性本身也是一个对象）
vlinkColor	表示已经访问的链接文字的颜色，对应<body>标记中的vlink属性
title	当前的文档标题对象
body	当前的文档主体对象
readyState	获取某个对象的当前状态
URL	获取或设置URL

文档对象的常用方法

Document对象的常用方法及说明
close	关闭文档的输出流
open	打开一个文档输出流并接受write和writeIn方法创建页面内容
write	向文档中写入HTML或Javascript语句
writeIn	向文档中写入HTML或Javascript语句，并以换行符结束
createElement	创建一个HTML标记
getElementById	获取指定id的HTML标记

链接文字颜色设置

(1)alinkColor属性

该属性用来获取或设置当链接被单击时显示的颜色。

语法如下：

[color=]document.alinkcolor[=setColor]

setColor:可选项，用来设置颜色的名称或颜色的RGB值

color:可选项,是一个字符串变量，用来获取颜色值。

(2)linkColor属性

该属性用来获取或设置当前页面中链接未被点击的链接颜色

[color=]document.linkcolor[=setColor]

(3)vlinkColor属性

该属性用来获取或设置当前页面中被单击过的链接颜色

//将3个状态的超链接文字颜色分别定义在文本框中，单击“确定”后实现对页面中超链接颜色的设置

<span>默认的超链接文字颜色：</span><input class="ys" type="text"value="red" /><br>

<span>单击时的超链接文字颜色：</span><input class="ys" type="text"value="green" /><br><span>单击过的超链接文字颜色：</span><input class="ys" type="text"value="blue" /><br>

<input type="button" οnclick="bian()" value="确定" /><br>
<span><a href="#">单击进入明日学院官方网站</a></span>
<script>//浏览器兼容有问题，用IE,"确定后"ys[0].value颜色才会变
function bian(){
var ys=document.getElementsByClassName("ys");
document.linkColor=ys[0].value;
document.alinkColor=ys[1].value;
document.vlinkColor=ys[2].value;
}
</script>

-----------------------------------------------------------------------------------------------------------

文档背景色和前景色设置

<!--（1）bgColor属性
该属性用来获取或设置页面的背景颜色
语法：[color=]document.bgColor[=setColor]
参数说明：
setColor:可选项，用来设置颜色的名称或颜色的RGB值。
color:可选项，是一个字符串变量，用来获取颜色值。

（2）fgColor属性；该属性用来获取或设置页面的前景颜色，即页面中的文字颜色-->

动态改变文档的前景色和背景色

//网页自动变色

window.οnlοad=function(){
var Arraycolor=new Array("#00FF66","#FFFF99","#99CCFF","#FFCCFF","#FFCC99","#00FFFF");
var n=0;
setInterval(function changecolors(){
n++;
if(n==(Arraycolor.length-1))n=0;
document.bgColor=Arraycolor[n];
document.fgColor=Arraycolor[n-1];
},1000) ;

}

</script>

----------------------------------------------------------------------------------------------------

下面这种方法，不可以实现

看到请补坑

window.οnlοad=function(){
var Arraycolor=new Array("#00FF66","#FFFF99","#99CCFF","#FFCCFF","#FFCC99","#00FFFF");

var n=0;

function changecolors(){
n++;
if(n==(Arraycolor.length-1))n=0;
document.bgColor=Arraycolor[n];
document.fgColor=Arraycolor[n-1];
setTimeout("changecolors()",1000);
}//设计到递归函数，在定义递归函数时，需要两个必要条件：包括一个结束递归的条件，包括一个递归调用语句
changecolors();

}

</script>

---------------------------------------------------

//根据下拉菜单值改变页面颜色

<form name="form1">
请选择页面背景颜色：<select name="color"οnchange="huanse()">
<option value="red">红色</option>
<option value="orange">橙色</option>
<option value="green">绿色</option>
<option value="blue">蓝色</option>
</select>
</form>
<script>

document.bgColor="red";
function huanse(){
document.bgColor=form1.color.value;
}

</script>

-------------------------------------------------------------------------------------------------------------------

//切换颜色

明日科技出品必属佳品<input type="button" value="交换颜色" οnclick="jiaohuan()" />
<script>

document.bgColor="white";
document.fgColor="black";

function jiaohuan(){
if(document.bgColor=="white") {

document.bgColor="black";
document.fgColor="white";

}
else if(document.bgColor=="black")
{

document.bgColor="white";
document.fgColor="black";
}
}

</script>

boat_sea

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
文档对象（1）

文档对象的常用属性 Document对象的常用属性及说明 alinkColor 链接文字被单击时的颜色，对应&lt;body&gt;标记中的alink属性 all[] 存储HTML标记的一个数组（该属性本身也是一个对象） bgColor 文档的背景颜色，对应&lt;body&gt;标记中的bgcolor属性 fgColor 文档的文本颜色（...
复制链接

扫一扫