客户端JavaScript（二）--document、表单和表单元素

最新推荐文章于 2022-03-04 20:24:28 发布

xiao_fan__

最新推荐文章于 2022-03-04 20:24:28 发布

阅读量373

点赞数

分类专栏：笔记

本文链接：https://blog.csdn.net/xiao_fan__/article/details/105539121

版权

document对象

Document 对象是是window对象的一个属性，因此可以将document对象作为一个全局对象来访问。当浏览器载入 HTML 文档, 它就会成为 Document 对象。

一、document对象的属性

html元素和body对象

document.documentElement 获取html元素，文档的根节点

document.body 获取文档的body元素
文档信息

document.title 获取文档标题My title

document.URL
返回文档完整的URL比如：{协议}：//{用户名}:{密码}@{主机名}:{端口号}/{路径}/{文件}?{参数}

document.domain 返回当前文档的域名。

document.referrer 返回载入当前页面的URL
获取元素–Element

getElementById();

getElementsByTagName(); 标签

getElementsByName(); name

getElementsByClassName();

querySelector(); 获取匹配的第一个元素！ ()中可以是css选择器的标准形式兼容到css2. ( id,
类, 类型, 属性, 属性值)。

querySelectorAll(); 获取元素集合，()中可以是css选择器的标准形式兼容到css2.
特殊集合

1）document.anchors:返回文档中所有带那么特性的<a>元素。

2）document.forms:返回文档中所有的<form>元素，与document.getElementByTagName(“form”)的到的结果相同。

3）document.images:返回文档中所有的<img>元素，与document.getElementByTagName(“img”)的到的结果相同。

4）document.links:返回文档中所有带href特性的<a>元素。
　　
5）document.applets[]:applet对象的一个数组，该对象代表文档中的Java小程序。

6）lastMondified：一个字符串，包含文档的修改日期
颜色属性
bgColor：文档的背景颜色

fgColor：文档的前景颜色

linkColor：定义超链接的颜色，超链接是没有被访问的链接

alinkColor：定义超链接的颜色，超链接是激活过的链接

vlinkColor：定义超链接的颜色，超链接是访问过的链接
其他

document.addEventListener() 向文档添加句柄

removeEventListener()

document.cookie() 设置或返回与当前文档有关的所有cookie

createElement() 创建元素节点

createTextNode() 创建文本节点

二、document对象的方法

write() 向文档写 HTML 表达式或 JavaScript 代码。

open() 打开一个流，用来收集来自任何write()或writeln()方法的输出。

close() 关闭输入流，并显示数据

表单和表单元素

一、From对象

document.forms[] 是一个数组，包含了文档中所有的表单（<form>）。要引用单个表单，可以用 document.forms[x]，但是一般来说，人们都会这样做：在<form>标记中加上“name="…"”属性，那么直接用 “document.<表单名>”就可以引用了。

属性
name 返回表单的名称，也就是<form name="...">属性。 action 返回/设定表单的提交地址，也就是<form action="...">属性。 method
返回/设定表单的提交方法，也就是<form method="...">属性。 target
返回/设定表单提交后返回的窗口，也就是<form target="...">属性。 encoding
返回/设定表单提交内容的编码方式，也就是<form enctype="...">属性。 length 返回该表单所含元素的数目。
enctype属性：编码方式
方法
reset() 重置表单。这与按下“重置”按钮是一样的。
submit() 提交表单。这与按下“提交”按钮是一样的。
事件
onreset; onsubmit

<form onreset="return confirm('really dsddds)"></form>

与onsubmit一样，只有真正点击Rest按钮才会触发onreset事件处理程序，调用表单的reset（）方式不会触发它。

二、定义表单元素

在这里插入图片描述

<!DOCTYPE HTML>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title></title>
</head>
<body>
    <form name="everything">
        <table border="border" cellpadding="5">
              <tr>
                <td>UserName:<br/>[1]<input type="TEXT" name="username" size="15"/></td>
                  <td>Password:<br/>[2]:<input type="PASSWORD" name="password" size="15"/>  </td>
                  <td rowspan="4">Input Events[3]<br/><textarea name="textarea" rows="20" cols="28"/></textarea

最低0.47元/天解锁文章

xiao_fan__

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
客户端JavaScript（二）--document、表单和表单元素

document对象Document 对象是是window对象的一个属性，因此可以将document对象作为一个全局对象来访问。当浏览器载入 HTML 文档, 它就会成为 Document 对象。一、document对象的属性html元素和body对象document.documentElement 获取html元素，文档的根节点document.body 获取文档的body元素...
复制链接

扫一扫