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 相关文章推荐
Windows Live的@live.com域名注册漏洞 利用代码
Dec 27 Javascript
jQuery学习4 浏览器的事件模型
Feb 07 Javascript
仿中关村在线首页弹出式广告插件(jQuery版)
May 03 Javascript
JavaScript中的数学运算介绍
Dec 29 Javascript
以WordPress为例讲解jQuery美化页面Title的方法
May 23 Javascript
阿里云ecs服务器中安装部署node.js的步骤
Oct 08 Javascript
JS版微信6.0分享接口用法分析
Oct 13 Javascript
关于jQuery中fade(),show()起始位置的一点小发现
Apr 25 jQuery
基于Vue的ajax公共方法(详解)
Jan 20 Javascript
node.js博客项目开发手记
Mar 16 Javascript
七行JSON代码把你的网站变成移动应用过程详解
Jul 09 Javascript
React.js组件实现拖拽排序组件功能过程解析
Apr 27 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搜索文件程序分享
2015/10/30 PHP
PHP7.1新功能之Nullable Type用法分析
2016/09/26 PHP
PHP封装的分页类与简单用法示例
2019/02/25 PHP
麻雀虽小五脏俱全 Dojo自定义控件应用
2010/09/04 Javascript
基于jQuery的input输入框下拉提示层(自动邮箱后缀名)
2012/06/14 Javascript
javascript改变position值实现菜单滚动至顶部后固定
2013/01/18 Javascript
JQuery写动态树示例代码
2013/07/31 Javascript
javascript的document.referrer浏览器支持、失效情况总结
2014/07/18 Javascript
使用js画图之饼图
2015/01/12 Javascript
JavaScript三元运算符的多种使用技巧
2015/04/16 Javascript
基于javascript如何传递特殊字符
2015/11/30 Javascript
Bootstrap每天必学之折叠
2016/04/12 Javascript
微信小程序 教程之引用
2016/10/18 Javascript
jquery处理checkbox(复选框)是否被选中实例代码
2017/06/12 jQuery
jquery中ajax请求后台数据成功后既不执行success也不执行error的完美解决方法
2017/12/24 jQuery
vue 纯js监听滚动条到底部的实例讲解
2018/09/03 Javascript
小程序实现上下移动切换位置
2019/09/23 Javascript
JS forEach跳出循环2种实现方法
2020/06/24 Javascript
jQuery实现移动端下拉展现新的内容回弹动画
2020/06/24 jQuery
JQuery Ajax如何实现注册检测用户名
2020/09/25 jQuery
vue实现桌面向网页拖动文件的示例代码(可显示图片/音频/视频)
2021/03/01 Vue.js
[03:12]完美世界DOTA2联赛PWL DAY7集锦
2020/11/06 DOTA
[50:02]完美世界DOTA2联赛PWL S2 Magma vs FTD 第三场 11.29
2020/12/03 DOTA
python常用函数详解
2016/09/13 Python
pymongo中group by的操作方法教程
2019/03/22 Python
Python代码一键转Jar包及Java调用Python新姿势
2020/03/10 Python
哪种Python框架适合你?简单介绍几种主流Python框架
2020/08/04 Python
python使用matplotlib:subplot绘制多个子图的示例
2020/09/24 Python
美国诺德斯特龙百货官网:Nordstrom
2016/08/23 全球购物
Crocs美国官方网站:卡骆驰洞洞鞋
2017/08/04 全球购物
雅高酒店中国:Accorhotels.com China
2018/03/26 全球购物
某公司部分笔试题
2013/11/05 面试题
PHP使用Redis队列执行定时任务实例讲解
2021/03/24 PHP
大学生的四年学习自我评价
2013/12/13 职场文书
浅析CSS在DevTools 中架构演变
2021/10/05 HTML / CSS
python+pyhyper实现识别图片中的车牌号思路详解
2022/12/24 Python