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


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 相关文章推荐
基于JavaScript实现继承机制之调用call()与apply()的方法详解
May 07 Javascript
在javaScript中关于submit和button的区别介绍
Oct 20 Javascript
JavaScript数据推送Comet技术详解
Apr 07 Javascript
jQuery实现侧浮窗与中浮窗切换效果的方法
Sep 05 Javascript
jQuery实现的小图列表,大图展示效果幻灯片示例
Oct 25 Javascript
浅析bootstrap原理及优缺点
Mar 19 Javascript
浅析微信扫码登录原理(小结)
Oct 29 Javascript
fetch 如何实现请求数据
Dec 20 Javascript
ES6中Set和Map数据结构,Map与其它数据结构互相转换操作实例详解
Feb 28 Javascript
详解Vue中使用Axios拦截器
Apr 22 Javascript
Ant Design Vue 添加区分中英文的长度校验功能
Jan 21 Javascript
解决vue使用vant下拉框van-dropdown-item 绑定title值不变问题
Aug 05 Javascript
简单选项卡 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
You might like
php 一元分词算法
2009/11/30 PHP
PHP类的使用 实例代码讲解
2009/12/28 PHP
php+js实现百度地图多点标注的方法
2016/11/30 PHP
javascript中巧用“闭包”实现程序的暂停执行功能
2007/04/04 Javascript
权威JavaScript 中的内存泄露模式
2007/08/13 Javascript
50个比较实用jQuery代码段
2011/09/18 Javascript
Javascript Web Slider 焦点图示例源码
2013/10/10 Javascript
jquery及原生js获取select下拉框选中的值示例
2013/10/25 Javascript
js获取url中指定参数值的示例代码
2013/12/14 Javascript
用jquery修复在iframe下的页面锚点失效问题
2014/08/22 Javascript
自己动手写的jquery分页控件(非常简单实用)
2015/10/28 Javascript
浅谈javascript中的事件冒泡和事件捕获
2016/12/28 Javascript
运用js实现图层拖拽的功能
2019/05/24 Javascript
微信小程序之侧边栏滑动实现过程解析(附完整源码)
2019/08/23 Javascript
React冒泡和阻止冒泡的应用详解
2020/08/18 Javascript
JavaScript实现前端倒计时效果
2021/02/09 Javascript
Python中使用md5sum检查目录中相同文件代码分享
2015/02/02 Python
python中abs&amp;map&amp;reduce简介
2018/02/20 Python
APIStar:一个专为Python3设计的API框架
2018/09/26 Python
python 返回列表中某个值的索引方法
2018/11/07 Python
Python发展史及网络爬虫
2019/06/19 Python
解决pycharm上的jupyter notebook端口被占用问题
2019/12/17 Python
Python Scrapy图片爬取原理及代码实例
2020/06/12 Python
Django 用户认证Auth组件的使用
2020/11/30 Python
免费获得微软MCSD证书赶快行动吧!
2012/11/13 HTML / CSS
英国女士家居服网站:hush
2017/08/09 全球购物
UNDONE手表官网:世界领先的定制手表品牌
2018/11/13 全球购物
Sarenza德国:法国最大的时尚鞋和包包网上商店
2019/06/08 全球购物
会计系个人求职信范文分享
2013/12/20 职场文书
试用期转正鉴定评语
2014/01/27 职场文书
高二化学教学反思
2014/01/30 职场文书
《植物妈妈有办法》教学反思
2014/02/25 职场文书
六一儿童节活动总结
2014/08/27 职场文书
雷锋的故事观后感
2015/06/10 职场文书
出纳2015年度工作总结范文
2015/10/14 职场文书
《一面五星红旗》教学反思
2016/02/23 职场文书