2020/6/2 JS DOM访问表单、下拉框、表格的常用属性和方法,对HTML元素的增删改操作

1.DOM访问表单控件的常用属性和方法如下:

  action:返回该表单的提交地址。

  elements:返回表单内全部表单控件所组成的数组,通过数组可以访问表单内的任何表单控件。

  length:返回表单内表单域的个数。

  method:返回表单内的method属性,主要有get和post两个值。

  target:确定提交表单时的结果窗口,主要有_self、_blank、_top等。

  reset()、submit():重置表单和确定表单方法。

2.在elements返回的数组中访问具体的表单控件:

  .elements[index]:返回该表单中第index个表单控件。

  .elements[elementName]:返回表单内id或name为elementName的表单控件。

  .elementName:返回表单内id或name为elementName的表单控件。

3.DOM访问列表框、下拉菜单的常用属性:

  form:返回列表框、下拉菜单所在的表单对象。

  length:返回列表框、下拉菜单的选项个数。

  options:返回列表框、下拉菜单里所有选项组成的数组。

  selectedIndex:返回下拉列表中选中选项的索引。

  type:返回下拉列表的类型,多选的话返回select-multiple,单选返回select-one

4.使用options[index]返回具体选项所对应的常用属性:

  defaultSelected:返回该选项默认是否被选中。

  index:返回该选项在列表框、下拉菜单中的索引。

  selected:返回该选项是否被选中。

  text:返回该选项呈现的文本。

  value:返回该选项的value属性值。

5. DOM访问表格子元素的常用属性和方法:

  caption:返回表格的标题对象。

  rows:返回该表格里的所有表格行(数组)。

  cells:返回该表格行内所有的单元格组成的数组。

  cellIndex:返回该单元格在表格行内的索引值。

6.  DOM对HTML元素的增删改

  DOM创建节点的方法:document.createElement(Tag),Tag必须是合法的HTML元素

  DOM复制节点的方法:节点cloneNode(boolean deep),当deep为true时,表示复制当前节点以及当前结点的全部后代节点。为false时,只复制当前节点。

              浅复制:只复制元素节点          深复制:元素节点以及其中的文本节点属性都复制

  DOM添加、删除节点的方法:

        appendChild(newNode):将newNode添加成当前节点的最后一个子节点。

        insertBefore(newNode,refNode):将refNode节点之前插入newNode节点。

        replaceChild(newNode,oldNode):将oldNode节点替换成newNode节点。

        removeChild(oldNode):将oldNode子节点删除。

7.DOM为下拉菜单(select)添加选项的方式:

  创建select元素节点:var select=document.createElement("select");

  设置select标签的id属性以及size属性:select.id = "city";

                      select.size = 5;
  循环创建option元素:for (i = 0; i < 10; i++) {
                      创建option元素:
               var option = new Option("选项" + i, i);
              将option元素添加到ul里:
                      select.options[i] = option;
                  }
  获取body标签:var body = document.getElementsByTagName("body")[0];
  将select元素添加到body标签中:body.appendChild(select);

  删除option:(删除select下的最后一个option) select.remove(select.options.length - 1);

  清空下拉菜单:(直接让option组成的数组的长度为0)select.options.length = 0;

       

 

2020/6/2 JS DOM访问表单、下拉框、表格的常用属性和方法,对HTML元素的增删改操作

上一篇:对接万里牛erp 的curl方法和毫秒级时间戳


下一篇:win7 64 VC++ ado方式连接access 连接字符串