JavaScript和JQuery获取DIV值的方法示例


Posted in Javascript onMarch 07, 2017

本文实例讲述了JavaScript和JQuery获取DIV值的方法。分享给大家供大家参考,具体如下:

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>JavaScript和JQuery获取DIV的值</title>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
   $(function(){
     $("#jqueryInput").click(function(){
       var divValue = $("#div_val").text();
       var divVal = $("#div_val").html();
       alert("JQuery获取DIV的值:"+divValue+"\n"+divVal);
     });
   });
   function javaScriptDiv()
   {
     var divVal = document.getElementById("div_val").innerHTML;
     alert("JavaScript获取DIV的值:"+divVal);
   }
</script>
</head>
<body>
  <div id="div_val">3water.com</div>
  <input type="button" value="JavaScript获取DIV的值" onclick="javaScriptDiv()"/>
  <input type="button" value="JQuery获取DIV的值" id="jqueryInput"/>
</body>
</html>

2、运行结果:

(1)初始化

JavaScript和JQuery获取DIV值的方法示例

(2)点击”JavaScript获取DIV的值“按钮

JavaScript和JQuery获取DIV值的方法示例

(3)点击”jQuery获取DIV的值“按钮

JavaScript和JQuery获取DIV值的方法示例

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jQuery 中关于CSS操作部分使用说明
Jun 10 Javascript
JS删除字符串中重复字符方法
Mar 09 Javascript
For循环中分号隔开的3部分的执行顺序探讨
May 27 Javascript
JavaScript实现的使用键盘控制人物走动实例
Aug 27 Javascript
JavaScript实现简单的tab选项卡切换
Jan 05 Javascript
angular.js分页代码的实例
Jul 27 Javascript
JavaScript实现按键精灵的原理分析
Feb 21 Javascript
JS简单判断滚动条的滚动方向实现方法
Apr 28 Javascript
360doc网站不登录就无法复制内容的解决方法
Jan 27 Javascript
vue-devtools的安装步骤
Apr 23 Javascript
浅谈Javascript中的对象和继承
Apr 19 Javascript
js实现时钟定时器
Mar 26 Javascript
AngularJS监听路由变化的方法
Mar 07 #Javascript
微信小程序开发之入门实例教程篇
Mar 07 #Javascript
JavaScript实现替换字符串中最后一个字符的方法
Mar 07 #Javascript
Node.js查找当前目录下文件夹实例代码
Mar 07 #Javascript
jQuery模拟下拉框选择对应菜单的内容
Mar 07 #Javascript
详解JS异步加载的三种方式
Mar 07 #Javascript
无法获取隐藏元素宽度和高度的解决方案
Mar 07 #Javascript
You might like
关于Appserv无法打开localhost问题的解决方法
2009/10/16 PHP
浅析php中如何在有限的内存中读取大文件
2013/07/02 PHP
记录一次排查PHP脚本执行卡住的问题
2016/12/27 PHP
PHP钩子与简单分发方式实例分析
2017/09/04 PHP
yii2中关于加密解密的那些事儿
2018/06/12 PHP
从零开始学习jQuery (十) jQueryUI常用功能实战
2011/02/23 Javascript
深入理解JavaScript系列(16) 闭包(Closures)
2012/04/12 Javascript
IE6下opacity与JQuery的奇妙结合
2013/03/01 Javascript
jquery 定位input元素的几种方法小结
2013/07/28 Javascript
jQuery 追加元素的方法如append、prepend、before
2014/01/16 Javascript
捕获和分析JavaScript Error的方法
2014/03/25 Javascript
Javascript对象Clone实例分析
2015/06/09 Javascript
jquery实现仿新浪微博评论滚动效果
2015/08/06 Javascript
JavaScript闭包和范围实例详解
2016/12/19 Javascript
微信小程序商城项目之侧栏分类效果(1)
2017/04/17 Javascript
Vue.js 2.5新特性介绍(推荐)
2017/10/24 Javascript
jQuery实现带右侧索引功能的通讯录示例【附源码下载】
2018/04/17 jQuery
微信浏览器下拉黑边解决方案 wScroollFix
2020/01/21 Javascript
[07:59]2014DOTA2叨叨刀塔 林熊猫称被邀请赛现场盛况震撼
2014/07/21 DOTA
python tkinter实现彩球碰撞屏保
2019/07/30 Python
python创建学生管理系统
2019/11/22 Python
基于python及pytorch中乘法的使用详解
2019/12/27 Python
python3.6.5基于kerberos认证的hive和hdfs连接调用方式
2020/06/06 Python
详解CSS3中nth-child与nth-of-type的区别
2017/01/05 HTML / CSS
C++:memset ,memcpy和strcpy的根本区别
2013/04/27 面试题
OLEDBConnection和SQLConnection有什么区别
2013/05/31 面试题
网上常见的一份Linux面试题(多项选择部分)
2014/09/09 面试题
优秀党员转正的自我评价
2013/10/06 职场文书
怎样写好自荐信和推荐信
2013/12/26 职场文书
音乐教学反思
2014/02/02 职场文书
读书伴我成长演讲稿
2014/05/07 职场文书
服务承诺书格式
2014/05/21 职场文书
齐云山导游词
2015/02/06 职场文书
2019通用版劳动合同范本!
2019/07/11 职场文书
详解Flutter网络请求Dio库的使用及封装
2022/04/14 Java/Android
一文搞懂PHP中的抽象类和接口
2022/05/25 PHP