js DOM操作练习
1.有如下html，如果用js获得被选中的option的text描述（非value）
<select id="select_id">
<option vlue="1">text1</option>
<option vlue="2">text2</option>
<option vlue="3">text3</option>
<option vlue="4">text4</option>
</select>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head> <body>
<select id="select_id">
<option value="text1">text1</option>
<option value="text2">text2</option>
<option value="text3">text3</option>
</select>
<script>
var obj=document.getElementById("select_id"); //获取select元素
obj.onchange=function(){
for(var i=0;i<obj.options.length;i++){
if(obj.options[i].selected)
alert(obj.options[i].text); //输出被选项的文本信息
}
}
</script>
</body>
</html>
2.有如下html，如何用js取得month的值
<form id="form_id">
<input type="radio" name="month"value=1 />
<input type="radio" name="month"value=2 />
<input type="radio" name="month"value=3 />
<input type="radio" name="month"value=4 />
</form>
3.有如下html，如何通过Dom方法来取得最后一个p的text
<html>
<head>
<title>DOM Example</title>
</head>
<body>
<p>Hello World!</p>
<p>Isn'T this exciting!<p>
<p>You're learning to ues ths DOM!</p>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<p>Hello World!</p>
<p>Isn'T this exciting!<p>
<p>You're learning to ues ths DOM!</p>
<script>
var obj=document.getElementsByTagName("p");
var txt=obj[obj.length-1].innerHTML||obj[obj.length-1].textContent; //IE与Firefox浏览器兼容
alert(txt);
</script>
</body>
</html>
4..要用标准dom方法来动态在页面body中加入如下html，该如何做？
<p id="pl">hello world</p>
<script>
var p=document.createElement("p"); //创建元素节点
var txt=document.createTextNode("hello world!"); //创建文本节点
p.appendChild(txt); // 将文本节点添加到新创建元素中
document.body.appendChild(p); //将添加了文本的元素添加到页面中
</script>
js DOM操作练习的更多相关文章
- JS DOM操作（创建、遍历、获取、操作、删除节点）
创建节点 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="u ...
- js dom 操作
JS的DOM操作 1DOM是文档对象模型,这种模型为树模型:文档是指标签文档,对象是指文档中每个元素:模型是指抽象化的东西. 2间隔与延迟间隔执行一段代码(函数):window.setInterv ...
- JS—DOM操作
节点分为三类: 1.元素节点:标签<div></div> 2.文本节点:标签内的纯文本. 3.属性节点:标签内的属性,id或class 查找元素: getElementById ...
- js——DOM操作（一）
DOM:Document Object Model 文档对象模型 文档:html页面 文档对象:页面中元素 文档对象模型:定义 为了能够让程序(js)去操作页面中的元素 DOM会把文档看作是一棵树 ...
- JS DOM操作 函数 事件 阻止事件冒泡
一 函数 1.字符串函数 s.tolowerCase( ): -- 变小写 s.toupperCase( ): -- 变大写 s.substr( 2 , 8 ): -- 截取 ...
- JS DOM操作（五） Window.docunment对象——操作元素
定位: var a = document.getElementByIt( "id" ) 同辈元素 var b = a.nextSibling; -- 找 a ...
- JS DOM操作（二） Window.docunment对象——操作样式
一 对元素的定位 在 js 中可以利用 id.class.name.标签名进行元素的定位 id.class 用在客户端 name 用在服务端 用 id 定位 -- ...
- JS DOM操作（一） 对页面的操作
DOM ——文档对象模型(Document Object Model)是表示和处理一个HTML或XML文档的常用方法. 在网页上,组织页面(或文档)的对象被组织在一个树形结构中,用来表示文档中对象的标 ...
- js dom 操作技巧
1.创建元素 创建元素:document.createElement() 使用document.createElement()可以创建新元素.这个方法只接受一个参数,即要创建元素的标签名.这个标签名在 ...
随机推荐
- STM32串口程序的一般配置方法
#include "stm32f10x.h" /************************************************ 该程序讲解串口程序的一般配置方法: ...
- eclipse中自动生成注释
eclipse中自动生成注释 包前缀设置的地方 注释模板设置的地方 Eclipse自动生成方法注释 快捷键 自动生成方法的注释格式,例如 /*** @param str* @return* @thro ...
- JavaEE JDBC 了解JNDI
了解JNDI @author ixenos Web与企业应用中的连接管理 1. 数据库连接方式: (1)使用配置文件 (2)使用JNDI 2. 在Web或企业环境中部署 JDBC应用时,数据库连接管理 ...
- HDU 1800 hash 找出现最多次数的字符串的次数
乘法hash: 这类hash函数利用了乘法的不相关性 int Hash(char *str){ int seed = 131 , value=0; while(*str != '\0'){ ...
- 解方程（codevs 3732）
题目描述 已知多项式方程: a0+a1x+a2x^2+..+anx^n=0 求这个方程在[1, m ] 内的整数解(n 和m 均为正整数) 输入输出格式 输入格式: 输入文件名为equation .i ...
- 【BZOJ1758】重建计划（点分治）
题意: 给定一棵n个点的树,每条边有权值.求一条链,这条链包含的边数在L和U之间,且平均边权最大.N﹤=100000 思路:RYZ作业 二分答案再点分治,寻找是否有大于0且边数在L和U之间的链 f[i ...
- 51nod1020 逆序排列
t<=10000个问,每次问n<=1000的全排列中逆序数对为k<=10000个的有多少,mod 1e9+7. 直接dp,$f(i,j)$--i的全排列中逆序数对为j的有多少,$f( ...
- [bzoj2463][中山市选2009]谁能赢呢？_博弈论
博弈论 bzoj-2463 中山市选-2009 题目大意:题目链接. 注释:略. 想法: 如果$n$是偶数的话就可以被多米诺骨牌恰好覆盖,这样的话只需要先手先走向(1,1)对应的第二段,后者必定会将棋 ...
- [bzoj1485][HNOI2009]有趣的数列_卡特兰数_组合数
有趣的数列 bzoj-1485 HNOI-2009 题目大意:求所有1~2n的排列满足奇数项递增,偶数项递增.相邻奇数项大于偶数项的序列个数%P. 注释:$1\le n\le 10^6$,$1\le ...
- Python学习系列之文件操作
Pyhton文件打开方式 with= open('文件路径','打开模式') as f:#PS:python3提供了with语句来帮我们自动调用close方法,所以说无论打开文件是否出错都能自动正确的 ...