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 相关文章推荐
js各种验证文本框输入格式(正则表达式)
Oct 22 Javascript
jqPlot 基于jquery的画图插件
Apr 26 Javascript
纯JS实现五子棋游戏兼容各浏览器(附源码)
Apr 24 Javascript
JS+CSS实现鼠标滑过时动态翻滚的导航条效果
Sep 24 Javascript
详解JS数据类型的值拷贝函数(深拷贝)
Jul 13 Javascript
Vue实现web分页组件详解
Nov 28 Javascript
react实现换肤功能的示例代码
Aug 14 Javascript
微信小程序实现判断是分享到群还是个人功能示例
May 03 Javascript
微信小程序3种位置API的使用方法详解
Aug 05 Javascript
微信小程序如何实现五星评价功能
Oct 15 Javascript
JavaScript简易计算器制作
Jan 17 Javascript
vue实现表格合并功能
Dec 01 Vue.js
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
Aliyun Linux 编译安装 php7.3 tengine2.3.2 mysql8.0 redis5的过程详解
2020/10/20 PHP
js window.onload 加载多个函数的方法
2009/11/02 Javascript
jQuery选择器的工作原理和优化分析
2011/07/25 Javascript
判断是否安装flash player及当前版本的JS代码
2013/08/08 Javascript
javascript封装addLoadEvent实现页面同时加载执行多个函数的方法
2016/07/25 Javascript
基于jQuery实现火焰灯效果导航菜单
2017/01/04 Javascript
javascript验证香港身份证的格式或真实性
2017/02/07 Javascript
jQuery插件HighCharts绘制2D金字塔图效果示例【附demo源码下载】
2017/03/09 Javascript
微信小程序 ES6Promise.all批量上传文件实现代码
2017/04/14 Javascript
微信小程序 五星评分的实现实例
2017/08/04 Javascript
Node.js中使用mongoose操作mongodb数据库的方法
2017/09/12 Javascript
React Native自定义控件底部抽屉菜单的示例
2018/02/08 Javascript
Angularjs中date过滤器失效的问题及解决方法
2018/07/06 Javascript
vue项目设置scrollTop不起作用(总结)
2018/12/21 Javascript
nuxt中使用路由守卫的方法步骤
2019/01/27 Javascript
Vue路由的模块自动化与统一加载实现
2020/06/05 Javascript
Django中的文件的上传的几种方式
2018/07/23 Python
详解python中init方法和随机数方法
2019/03/13 Python
python3通过selenium爬虫获取到dj商品的实例代码
2019/04/25 Python
将tensorflow模型打包成PB文件及PB文件读取方式
2020/01/23 Python
django orm模块中的 is_delete用法
2020/05/20 Python
使用Python将xmind脑图转成excel用例的实现代码(一)
2020/10/12 Python
彻底解决Python包下载慢问题
2020/11/15 Python
matplotlib 范围选区(SpanSelector)的使用
2021/02/24 Python
CSS中越界问题的经典解决方案【推荐】
2016/04/19 HTML / CSS
法国票务网站:Ticketmaster法国
2018/07/09 全球购物
人事主管的岗位职责
2013/11/16 职场文书
食堂员工工作职责
2013/12/18 职场文书
运动会邀请函范文
2014/01/31 职场文书
中国入世承诺
2014/04/01 职场文书
一般基层干部群众路线教育实践活动个人对照检查材料
2014/11/04 职场文书
2014年服务员个人工作总结
2014/12/23 职场文书
国庆节新闻稿
2015/07/17 职场文书
2015年酒店销售部工作总结
2015/07/24 职场文书
大学生志愿者心得体会
2016/01/15 职场文书
使用python求解迷宫问题的三种实现方法
2022/03/17 Python