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>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
