利用节点更改table内容
2024-10-15 06:42:16
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<meta name="author" content="" />
<link rel="stylesheet" type="text/css" href="" />
<style type="text/css"></style>
<script type="text/javascript"></script>
</head>
<body><table width="500" border="1"><tr><td>姓名</td><td>性别</td><td>年龄</td></tr><tr><td>奥特曼</td><td>男</td><td>26</td></tr></table>
<input type="button" value="查找table节点" onclick="find_table_node()">
<input type="button" value="修改男为女" onclick="edit_text_node()"> <script type="text/javascript">
function find_table_node(){
//查找html节点
var node_html=document.firstChild;
//alert(node_html.nodeName); //结果是对象
//查找body节点
var node_body=node_html.lastChild;
//alert(node_body);
var node_table=node_body.firstChild;
alert(node_table.nodeName);
} function edit_text_node(){
//查找body节点
var node_body=document.body;
//查找table节点
var node_body=document.body.firstChild;
//查找tbody节点
var node_tbody=node_body.firstChild;
//查找tr节点
var node_tr=node_tbody.lastChild;
//查找td节点 是数组
//childNodes返回的是一个数组,根据下标找td节点
var node_td = node_tr.childNodes[1];
//alert(node_td.nodeName);
//查找文本节点
var node_text=node_td.firstChild;
//修改内容为女
node_text.nodeValue="女";
//alert (node_text.nodeValue); }
</script> </body>
</html>
最新文章
- java中判断list是否为空的用法
- C# CompareTo 和 String.Compare
- linux------------centos防火墙
- 第4章 jQuery的事件和动画(1)——事件篇
- 【MySQL】原理 之 事务
- UIStoryboard
- TIMESTAMP 与 explicit_defaults_for_timestamp
- vagrant 设置除默认工项目之外的synced_folder一个坑
- [python]filter
- get改造成post请求
- springmvc中关于静态资源的放行
- imshow显示超大图像
- SpringCloud @FeignClient的类注解@ReqestMapping无效报错:No message available";,";path";:";/xxxx
- Coursera DeepLearning.ai Logistic Regression逻辑回归总结
- java 打印近似圆
- Codeforce Div-2 985 C. Liebig&#39;s Barrels
- Linux使用过程中常见问题及其解决方法
- .NET Core开发日志——从搭建开发环境开始
- 【转】matlab的textscan与textread区别
- consul之:ACL配置使用
热门文章
- JavaScript面试时候的坑洼沟洄——表达式与运算符
- Ubuntu上安装Robomongo及添加到启动器
- 【原】Telerik radwindow 在IE10下偶尔报 unable to get value of the property &#39;toLowerCase&#39; 的解决办法
- 2013 duilib入门简明教程 -- 完整的自绘标题栏(8)
- JMeter--一、安装JMeter
- 移动开发--Hybrid和Native混合开发-->;HybridApp 、NativeApp、WebApp
- java IO流 之 其他流
- Github团队开发集成以及eclipse集成
- WaitType:ASYNC_NETWORK_IO
- Security8:删除Role 和 User