为列表框,下拉菜单增加选项
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>为列表框,下拉菜单增加选项</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
</head>
<body id="test">
<script type="text/javascript">
//创建<select .../>对象
var a = document.createElement("select");
//为select对象增加元素
for(var i=0; i<10; i++){
var option = document.createElement("option");
option.innerHTML = '新增的选项' + i;
//将新的选项添加到列表框的最后
//a.add(option,null); //或者
a.appendChild(option);
}
a.size = 5;
//将列表框增加成body元素的子节点
document.getElementById("test").appendChild(a);
</script>
</body>
</html>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>为列表框,下拉菜单增加选项</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
</head>
<body id="test">
<input type="button" value="增加" disabled="disabled" id="add" onclick="add();" />
<input type="button" value="删除" id="delete" onclick="del();" />
<div id="target" style="width: 240px;height: 50px;border: 1px solid black;">
被控制的目标元素
</div> <br>
<script type="text/javascript">
var body = document.getElementById("test");
var target = document.getElementById("target");
function add(){
body.appendChild(target);
document.getElementById("add").disabled = "disabled";
document.getElementById("delete").disabled = "";
}
function del(){
body.removeChild(target);
document.getElementById("delete").disabled = "disabled";
document.getElementById("add").disabled = "";
}
</script>
<script type="text/javascript">
//创建<select .../>对象
var a = document.createElement("select");
//为select对象增加元素
for(var i=0; i<10; i++){
var option = new Option('新增的选项'+i);
//直接为指定的选项赋值
a.options[i] = option;
}
a.size = 5;
//将列表框增加成body元素的子节点
document.getElementById("test").appendChild(a);
</script>
</body>
</html>
相关推荐
Virtual DOM 是一个 JavaScript DOM 模型,支持元素创建,区别计算和分支操作,提供高效的渲染。代码示例var h = require('virtual-dom/h'); var diff = require('virtual-dom/diff'); var patch = require...
DOM 的基本对象有5个:Document ,Node ,NodeList ,Element 和Attr 。本文档主要描述了这5个文档的主要方法的使用。
DOM (文档对象模型) DOM 分类 DOM对象 Document文档对象 element文档对象 DOM事件操作 鼠标事件 键盘事件 触屏事件 特殊事件 表单事件 浏览器兼容处理 兼容性写法,封装工具 BOM(浏览器对象模型) 1. window ...
可以说,整个DOM模型都是由元素节点(element node)组成 比如文本段落元素“”,无序清单的名称“”,元素节点包含其他元素、 2.文本节点(text node) 例如中的文本“标题1”,中的文字内容,这些具体文本在DOM称为(text...
每一个HTML页面都有一个层次分明的DOM树模型,浏览器中的所有内容都有相应的DOM对象,动态改变页面 的内容,正是通过使用脚本语言来操作DOM对象实现。(通常使用getElementById/Ext.getDOM获得DOM对象 )仅仅有DOM是...
本文概述DOM分类,document的方法以及属性、element的方法和属性document获取全局内容和创建全局内容,其中包括了节点属性和节点的相关方法和分类,本文结尾拓展了操作节点的方法和删除空文本节点的相关方法
详细介绍 javascript的DOM对象模型
在了解DOM(文本对象模型)的框架和节点后,最重要的是使用这些节点处理html网页 对于一个DOM节点node,都有一系列的属性和方法可以使用。常用的有下表。 完善:http://www.w3school.com.cn/xmldom/dom_element.asp 1...
该模型并非只针对 Python,而是一种普通XML 模型。Python 的 DOM 包是基于 SAX 构建的,并且包括在 Python 2.0 的标准 XML 支持里。 一、xml.dom的简单介绍 1、主要方法: minidom.parse(filename):加载读取XML...
节点树3.DOM选择器:(查询、创建、添加,修改,删除)4.DOM的基本操作①.添加②.插入③.替换④.删除5.DOM节点类型(元素和文本)6.DOM属性节点7.DOM高级操作 1. DOM的概念和作用 DOM 是 JavaScript操作网页的api接口...
为了便于DOM操作,AngularJS内部封装了angular.element,如果现有项目中已经引入的jQuery,angular.element相当于jQuery函数的别名,否则,angular.element代表AngularJS对jQuery封装的一个子集,称为”jQuery lite...
let size = getElementSize( element ); 参数 元素可以是DOM元素或选择器字符串。 如果它是选择器字符串,则函数将通过调用document.querySelector来获取元素。 退货 包含框模型值的键值对的对象。 size = { ...
DOM: 文档对象模型( Document Object Model ,简称DOM) . DOM树 文档:一个页面就是一个文档,在DOM中使用document表示 元素:页面中的所有标签都是元素,DOM中使用element表示 节点:网页中的所有内容都是节点(标签、...
在 HTML DOM (文档对象模型)中,每个部分都是节点。 节点是DOM结构中最基本的组成...要注意:NodeList是‘动态的’,也就是说,每次访问NodeList对象,都会运行一次查询,虽然这样增加了开销,但可以保证我们新添加的
一、背景知识介绍 通常为DOM元素增加事件有以下几种办法: 1,硬编码形式 2,事件监听 3,JS框架提供的事件绑定 1,硬编码形式,采用的是原始事件(Original Event)的形式。 代码类似如下: 代码如下: <element xss...
文章目录一、DOM的概念二、DHTML与HTML DOM三、Document对象获取元素方法四、Element对象与属性相关方法五、对DOM对象的操作1、DOM对象的属性2、创建元素3、挂载元素4、删除元素5、克隆元素六、调整元素样式的方式七...
焦点观察者随着 ShadowDOM 的引入,为了可访问性功能而跟踪页面上的活动焦点元素变得很复杂。 FocusObserver旨在简化对跨越可访问性树的整个深度的焦点变化的观察,包括阴影根内的树的部分。用法FocusObserver有一个...
DOM表示被加载到浏览器窗口里的当前页面:浏览器向我们提供了当前页面的模型,而我们可以通过JavaScript访问这个模型 DOM把一份文档表示为一棵树 如下的HTML页面: 浏览器加载该页面并将之转换为树形...
DOM: 文档对象模型 将一个XML(html)文档 的每一个元素解析成java中的一个一个的对象 D Document 文档(XML文档) : 磁盘上面的xml文件 O Object 对象(Java对象) : 把xml文件封装成Java对象 M Model ...
动态添加菜单按钮到Toolbar 61 更方便的是 61 下一步是 62 模板(Templates)起步 62 第一步 您的HTML模板 62 第二步,将数据加入到模板中 62 下一步 63 学习利用模板(Templates)的格式化功能 63 正式开始 63 下...