javascript DOM实用学习资料第1/3页
时间:2024-04-25 13:09:44
访问指定节点:
getElementsByName():
<html> <head> <title>DOM技术</title> </head> <body> <form method="post" action="document.cgi"> <fieldset> <legend>选择你喜欢的颜色!</legend> <input type="radio" name="color" value="red"/>red <input type="radio" name="color" value="green"/>green <input type="radio" name="color" value="blue"/>blue </fieldset> <input type="submit" value="submit"> </form> <script language="javascript"> var oRadios=document.getElementsByName("color"); alert(oRadios[0].getAttribute("value")); </script> </body> </html>
<html> <head> <title>DOM技术</title> </head> <body> <form method="post" action="document.cgi"> <fieldset> <legend>选择你喜欢的颜色!</legend> <input type="radio" name="color" value="red"/>red <input type="radio" name="color" value="green"/>green <input type="radio" name="color" value="blue"/>blue </fieldset> <input type="submit" value="submit"> </form> <script language="javascript"> var oRadios=document.getElementsByName("color"); alert(oRadios[0].getAttribute("value")); </script> </body> </html>
getElementById():
<html> <head> <title> </title> <script type="text/javascript"> function getValue(){ var odiv1=document.getElementById("div1"); odiv1.innerText="hello!"; } </script> </head> <body onload="getValue()"> <div id="div1"></div> </body> </html>
<html> <head> <title> </title> <script type="text/javascript"> function getValue(){ var odiv1=document.getElementById("div1"); odiv1.innerText="hello!"; } </script> </head> <body onload="getValue()"> <div id="div1"></div> </body> </html>
createElement():
<html> <head> <title>创建节点</title> </head> <body onload="createM()"> </body> </html> <script language="javascript"> function createM(){ var op=document.createElement("p"); var otext=document.createTextNode("你好!"); op.appendChild(otext); document.body.appendChild(op); } </script>
<html> <head> <title>创建节点</title> </head> <body onload="createM()"> </body> </html> <script language="javascript"> function createM(){ var op=document.createElement("p"); var otext=document.createTextNode("你好!"); op.appendChild(otext); document.body.appendChild(op); } </script>
removeChild():
<html> <head> <title>删除节点</title> <script language="javascript"> function removeM(){ var op=document.body.getElementsByTagName("p")[0]; document.body.removeChild(op); } </script> </head> <body onload="removeM()"> <p>你好!</p> <p>hello world!</p> </body> </html>
<html> <head> <title>删除节点</title> <script language="javascript"> function removeM(){ var op=document.body.getElementsByTagName("p")[0]; document.body.removeChild(op); } </script> </head> <body onload="removeM()"> <p>你好!</p> <p>hello world!</p> </body> </html>
123下一页阅读全文
标签:javascript,DOM
![](/images/zang.png)
![](/images/jiucuo.png)
猜你喜欢
SQL实现相邻两行数据的加减乘除操作
2024-01-24 23:12:34
![](https://img.aspxhome.com/file/2023/6/118146_0s.jpg)
termux中matplotlib无法显示中文问题的解决方法
2022-12-16 00:07:16
![](https://img.aspxhome.com/file/2023/6/128516_0s.png)
对python添加模块路径的三种方法总结
2023-11-26 04:01:35
python输出决策树图形的例子
2022-02-07 09:14:54
不是原型继承那么简单!prototype的深度探索
2008-03-07 12:42:00
python 弹窗提示警告框MessageBox的实例
2023-11-12 01:07:17
mysql8.0.12如何重置root密码
2024-01-19 03:43:03
![](https://img.aspxhome.com/file/2023/1/99481_0s.jpg)
python tkinter实现简单计算器功能
2022-06-16 22:34:09
![](https://img.aspxhome.com/file/2023/7/108047_0s.jpg)
封装2个ajax函数
2010-09-03 18:14:00
解决使用OpenCV中的imread()内存报错问题
2022-06-06 03:14:21
![](https://img.aspxhome.com/file/2023/8/95598_0s.jpg)
全面了解python字符串和字典
2021-05-03 21:06:43
TensorFlow tf.nn.softmax_cross_entropy_with_logits的用法
2021-03-20 19:55:17
![](https://img.aspxhome.com/file/2023/0/130540_0s.png)
Python中的min及返回最小值索引的操作
2023-09-24 08:48:19
python实现录屏功能(亲测好用)
2022-01-12 19:54:34
![](https://img.aspxhome.com/file/2023/0/70840_0s.jpg)
得到文本框选中的文字,动态插入文字的js代码
2024-05-03 15:31:03
深入浅析Python科学计算库Scipy及安装步骤
2022-06-29 12:11:30
pycharm console 打印中文为乱码问题及解决
2023-06-15 22:30:02
![](https://img.aspxhome.com/file/2023/2/127802_0s.png)
使用python编写简单计算器
2023-08-27 17:07:46
![](https://img.aspxhome.com/file/2023/6/70646_0s.jpg)
浅谈pytorch卷积核大小的设置对全连接神经元的影响
2022-08-19 04:49:55
![](https://img.aspxhome.com/file/2023/7/127897_0s.jpg)
python类的方法属性与方法属性的动态绑定代码详解
2023-07-02 03:31:26