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 相关文章推荐
javascript显示隐藏层比较不错的方法分析
Sep 30 Javascript
JS实现模仿微博发布效果实例代码
Dec 16 Javascript
js 判断js函数、变量是否存在的简单示例代码
Mar 04 Javascript
Javascript让DEDECMS告别手写Tag
Sep 01 Javascript
AngularJS内置指令
Feb 04 Javascript
初识Node.js
Mar 20 Javascript
基于jquery插件编写countdown计时器
Jun 12 Javascript
vue .js绑定checkbox并获取、改变选中状态的实例
Aug 24 Javascript
vue--点击当前增加class,其他删除class的方法
Sep 15 Javascript
bootstrap tooltips在 angularJS中的使用方法
Apr 10 Javascript
手把手教你 CKEDITOR 4 扩展插件制作
Jun 18 Javascript
微信小程序 scroll-view的使用案例代码详解
Jun 11 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
测试php连接mysql是否成功的代码分享
2014/01/24 PHP
thinkphp autoload 命名空间自定义 namespace
2015/07/17 PHP
PHP如何通过传引用的思想实现无限分类(代码简单)
2015/10/13 PHP
PHP验证码生成原理和实现
2016/01/24 PHP
Yii操作数据库实现动态获取表名的方法
2016/03/29 PHP
php实现的网页版剪刀石头布游戏示例
2016/11/25 PHP
PHP有序表查找之插值查找算法示例
2018/02/10 PHP
php字符串过滤strip_tags()函数用法实例分析
2019/06/24 PHP
jquery text()要注意啦
2009/10/30 Javascript
javascript 限制输入脚本大全
2009/11/03 Javascript
高性能WEB开发 flush让页面分块,逐步呈现 flush让页面分块,逐步呈现
2010/06/19 Javascript
在Node.js中实现文件复制的方法和实例
2014/06/05 Javascript
JS中三目运算符和if else的区别分析与示例
2014/11/21 Javascript
JavaScript的==运算详解
2016/07/20 Javascript
js HTML5上传示例代码完整版
2016/10/10 Javascript
jQuery生成假加载动画效果
2016/12/01 Javascript
JavaScript实现类似淘宝的购物车效果
2017/03/16 Javascript
webpack2.0搭建前端项目的教程详解
2017/04/05 Javascript
vue.js element-ui tree树形控件改iview的方法
2018/03/29 Javascript
详解Vue一个案例引发「内容分发slot」的最全总结
2018/12/02 Javascript
Three.js实现3D机房效果
2018/12/30 Javascript
JavaScript如何实现元素全排列实例代码
2019/05/14 Javascript
React 全自动数据表格组件——BodeGrid的实现思路
2019/06/12 Javascript
python中管道用法入门实例
2015/06/04 Python
Python实现统计代码行的方法分析
2017/07/12 Python
python将文本中的空格替换为换行的方法
2018/03/19 Python
python使用selenium实现批量文件下载
2019/03/11 Python
基于Django的乐观锁与悲观锁解决订单并发问题详解
2019/07/31 Python
python无序链表删除重复项的方法
2020/01/17 Python
模具专业推荐信
2013/10/30 职场文书
任课老师推荐信范文
2013/11/24 职场文书
公司门卫岗位职责
2014/03/15 职场文书
党性分析材料格式
2014/12/19 职场文书
市场总监岗位职责
2015/02/11 职场文书
新员工入职感言范文!
2019/07/04 职场文书
新手必备之MySQL msi版本下载安装图文详细教程
2021/05/21 MySQL