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 相关文章推荐
prototype 1.5相关知识及他人笔记
Dec 16 Javascript
jQuery Div中加载其他页面的实现代码
Feb 27 Javascript
Extjs中的GridPanel隐藏列会显示在menuDisabled中解决方法
Jan 27 Javascript
jQuery中验证表单提交方式及序列化表单内容的实现
Jan 06 Javascript
Js删除数组中某一项或几项的几种方法(推荐)
Jul 27 Javascript
JS基于面向对象实现的选项卡效果示例
Dec 20 Javascript
JavaScript阻止表单提交方法(附代码)
Aug 15 Javascript
jQuery Collapse1.1.0折叠插件简单使用
Aug 28 jQuery
vue路由懒加载的实现方法
Mar 12 Javascript
JavaScript错误处理操作实例详解
Jan 04 Javascript
vue中filters 传入两个参数 / 使用两个filters的实现方法
Jul 15 Javascript
Element-ui树形控件el-tree自定义增删改和局部刷新及懒加载操作
Aug 31 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
解析百度搜索结果link?url=参数分析 (全)
2012/10/09 PHP
PHP文件上传主要代码讲解
2013/09/30 PHP
php利用curl抓取新浪微博内容示例
2014/04/27 PHP
event.srcElement 用法笔记e.target
2009/12/18 Javascript
JS 对输入框进行限制(常用的都有)
2013/07/30 Javascript
JavaScript关闭当前页面(窗口)不带任何提示
2014/03/26 Javascript
特殊情况下如何获取span里面的值
2014/05/20 Javascript
网页收藏夹显示ICO图标(代码少)
2015/08/04 Javascript
浅谈Node.js:Buffer模块
2016/12/05 Javascript
Jquery Easyui选项卡组件Tab使用详解(10)
2016/12/18 Javascript
浅析JavaScript的几种Math函数,random(),ceil(),round(),floor()
2016/12/22 Javascript
原生Aajax 和jQuery Ajax 写法个人总结
2017/03/24 jQuery
微信小程序访问node.js接口服务器搭建教程
2017/04/25 Javascript
解决ztree搜索中多级菜单展示不全问题
2017/07/05 Javascript
Vue 开发音乐播放器之歌手页右侧快速入口功能
2018/08/08 Javascript
详解webpack引用jquery(第三方模块)的三种办法
2019/08/21 jQuery
layui 上传图片 返回图片地址的方法
2019/09/26 Javascript
layui实现form表单同时提交数据和文件的代码
2019/10/25 Javascript
OpenLayers实现图层切换控件
2020/09/25 Javascript
python实现在每个独立进程中运行一个函数的方法
2015/04/23 Python
通过celery异步处理一个查询任务的完整代码
2019/11/19 Python
Keras 使用 Lambda层详解
2020/06/10 Python
HTML5页面中尝试调起APP功能
2017/09/12 HTML / CSS
One.com挪威:北欧成长最快的网络托管公司
2016/11/19 全球购物
英国顶级家庭折扣店:The Works
2017/09/06 全球购物
优秀员工自荐信范文
2013/10/05 职场文书
大学生冰淇淋店商业计划书
2014/01/14 职场文书
电子装配专业毕业生求职信
2014/04/23 职场文书
文明礼仪演讲稿
2014/05/12 职场文书
文明工地标语
2014/06/16 职场文书
解除劳动合同证明书
2014/09/26 职场文书
美术教师个人工作总结
2015/02/06 职场文书
农村结婚典礼主持词
2015/06/29 职场文书
变长双向rnn的正确使用姿势教学
2021/05/31 Python
Python利用FlashText算法实现替换字符串
2022/03/31 Python
图神经网络GNN算法
2022/05/11 Python