父节点获取子节点的字符串示例代码

更新时间：2014年02月26日 16:32:07 作者：

这篇文章主要介绍了父节点获取子节点的字符串的方法,需要的朋友可以参考下

1、JavaScript方法：document.getElementById("id").innerHTML;

（1）实例说明

 
<!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=utf-8" /> 
<title>获取HTML中的子项</title> 
<script type="text/javascript"> 
function getStr() 
{ 
var str = document.getElementById("div_child").innerHTML; 
alert(str); 
} 
</script> 
</head> 

<body> 
<div id="div_child"> 
<table> 
<tr> 
<th></th> 
<th></th> 
<th></th> 
<th></th> 
<th></th> 
</tr> 
<tr> 
<td></td> 
<td></td> 
<td></td> 
<td></td> 
<td></td> 
</tr> 
</table> 
<input type="button" id="btn" onclick="getStr()" value="获取字符串"/> 
</div> 
</body> 
</html> 

（2）点击按钮后，弹出信息

2、jQuery中的方法：$("#id").html()

（1）实例说明

复制代码代码如下:

 
<!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=utf-8" /> 
<title>jQuery中父节点获取子节点字符串</title> 
<script type="text/javascript" src="jquery-2.1.0.js"></script> 
<script type="text/javascript"> 
$(function(){ 
$("#btn").click(function(){ 
var str = $("#div_child").html(); 
alert(str); 
}); 
}); 
</script> 
</head> 

<body> 
<div id="div_child"> 
<table> 
<tr> 
<th></th> 
<th></th> 
<th></th> 
<th></th> 
<th></th> 
</tr> 
<tr> 
<td></td> 
<td></td> 
<td></td> 
<td></td> 
<td></td> 
</tr> 
<tr> 
<td></td> 
<td></td> 
<td></td> 
<td></td> 
<td></td> 
</tr> 
<tr> 
<td></td> 
<td></td> 
<td></td> 
<td></td> 
<td></td> 
</tr> 
</table> 
<input type="button" id="btn" value="获取值"/> 
</div> 
</body> 
</html> 

（2）运行结果

JS实现按钮颜色切换效果
这篇文章主要为大家详细介绍了JS实现按钮颜色切换效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-10-10
使用JS动态构建目录树
本文详细讲解了使用JS动态构建目录树的方法，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2022-01-01
微信小程序实现无缝滚动
这篇文章主要为大家详细介绍了微信小程序实现无缝滚动，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-03-03
Js利用prototype自定义数组方法示例
JS中的phototype是JS中比较难理解的一个部分，但下面这篇文章主要给大家介绍了关于Javascript利用prototype自定义数组的相关资料，通过实例给大家介绍phototype的使用，需要的朋友可以参考借鉴，下面随着小编来一起学习学习吧。
2017-10-10
JS中页面与页面之间超链接跳转中文乱码问题的解决办法
在原页面一张图片上添加了一个链接，链接中有中文，于是在跳转过程中出现中文乱码问题，下面给大家分享下解决方案
2016-12-12
javascript引用对象的方法代码
javascript引用对象的方法代码...
2007-08-08
页面间固定参数,通过cookie传值的实现方法
下面小编就为大家带来一篇页面间固定参数,通过cookie传值的实现方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-05-05
js构造函数创建对象是否加new问题
本篇文章主要给大家详细分析了js构造函数创建对象加new与不加new的问题，有这方面兴趣的参考学习下。
2018-01-01
javascript实现查询商品功能
这篇文章主要为大家详细介绍了javascript实现查询商品功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-09-09
微信小程序自定义多选事件的实现代码
本篇文章主要介绍了微信小程序自定义多选事件的实现代码，小程序和vue一样是没法操作dom的，所以要利用数组的下标和自定义属性来进行三元判断，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2018-05-05