网站首页 > 技术文章正文

JavaScript-document对象 239

hmc789 2024-11-20 16:32:45 技术文章 2 ℃

window对象代表浏览器;document对象代表整个文档页面(主要用于操作body中的元素)document对象的属性与方法在各个浏览器中的兼容性,重要的会说下,不重要的不再细说

1)document对象常见属性

1.1document.title //设置文档标题等价于HTML的<title>标签

1.2document.bgColor //设置页面背景色

1.3document.fgColor //设置前景色(文本颜色)

1.4document.linkColor //设置超链接的颜色(未点击过)

1.5document.charset //设置字符集(编码格式)

其他的如cookie(设置或获取cookie的值)fileSize获取文件大小等不再赘述

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
</head>
<body>
    <p>document对象</p>
    <a href="http://www.baidu.com">百度</a>
    <script type="text/javascript">
        document.title = '设置网页标题';
        //设置背景颜色(三种方式自己选择)
        document.bgColor = '#00ff95';
        document.bgColor = 'green';
        document.bgColor = 'rgb(66,88,99)';
        //设置前景色
        document.fgColor = 'red';
        //设置超链接颜色
        document.linkColor = 'blue';
        //设置网页的编码格式,防止网页出现乱码
        //网页文字如果是纯中文的建议编码格式设置为gb2312
        //网页文字如果是中英文混合的建议设置为utf-8
        document.charset = 'gb2312';
    </script>
</body>
</html>

2)document对象的write与writeln方法

<body>
  <input type="button" value="动态生成页面元素" onclick="f1();" />
    <script type="text/javascript">
        function f1() {
            document.write('这是通过document对象write()方法动态生成的文本');
            document.writeln('<br/>');//换行
            document.write("<a href='http://www.baidu.com'>百度</a>");
            //这种是通过\r\n方式换行,在原代码中换行而不是通过br方式进行的换行
            document.write('<pre>');//预格式化标签
      			//没有预格式化标签看不出效果
            document.writeln('aaa');
            document.write('bbb');
            document.write('</pre>');
        }
    </script>
</body>

注意:通过这种方式动态添加页面元素的弊端1)会覆盖网页中原有的内容除非需要不建议使用,之后会通过document对象的另一种方式动态创建页面元素 2)通过网页中右击"查看网页源代码"(谷歌)的方式,页面中没有该元素,需要通过右击的"检查"选项(谷歌的方式,IE的通过F12开发人员工具)才能看到动态创建的元素

网站首页 > 技术文章 正文

JavaScript-document对象 239

猜你喜欢

网站首页 > 技术文章正文