编程 Javascript

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

Posted in Javascript onFebruary 26, 2014

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）运行结果

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

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

jquery 分页控件实现代码

Nov 30 Javascript

JQuery里选择超链接的实现代码

May 22 Javascript

JS读取XML文件示例代码

Nov 15 Javascript

JQuery CheckBox（复选框）操作方法汇总

Apr 15 Javascript

Flow之一个新的Javascript静态类型检查器

Dec 21 Javascript

js获取页面引用的css样式表中的属性值方法(推荐)

Aug 19 Javascript

angularjs中ng-attr的用法详解

Dec 31 Javascript

微信小程序WebSocket实现聊天对话功能

Jul 06 Javascript

JS实现页面数据懒加载

Feb 13 Javascript

Vue中父子组件的值传递与方法传递

Sep 28 Javascript

JavaScript实现网页动态生成表格

Nov 25 Javascript

如何在vue 中使用柱状图并自修改配置

Jan 21 Vue.js

简单选项卡 js和jquery制作方法分享

Feb 26 #Javascript

display和visibility的区别示例介绍

Feb 26 #Javascript

js 赋值包含单引号双引号问题的解决方法

Feb 26 #Javascript

js返回上一页并刷新的多种实现方法

Feb 26 #Javascript

网站内容禁止复制和粘贴、另存为的js代码

Feb 26 #Javascript

Iframe 自动适应页面的高度示例代码

Feb 26 #Javascript

鼠标滑过出现预览的大图提示效果

Feb 26 #Javascript