jQuery实现获取h1-h6标题元素值的方法


Posted in Javascript onMarch 06, 2017

本文实例讲述了jQuery实现获取h1-h6标题元素值的方法。分享给大家供大家参考,具体如下:

1、问题背景:

查找到h1-h6,并遍历它们,打印出内容

2、实现代码:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>查找标题</title>
    <script type="text/javascript" src="jquery-1.7.2.min.js" ></script>
    <script>
      $(function(){
        //查找h1-h6
        $(":header").each(function(){
          $(this).click(function(event){
            console.info(event.target.innerText);
            console.log(event.currentTarget.innerHTML);
          });
        });
      });
    </script>
  </head>
  <body>
    <h1>Hello H1</h1>
    <h2>Hello H2</h2>
    <h3>Hello H3</h3>
    <h4>Hello H4</h4>
    <h5>Hello H5</h5>
    <h6>Hello H6</h6>
  </body>
</html>

3、运行效果图:

jQuery实现获取h1-h6标题元素值的方法

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

Javascript 相关文章推荐
window.open()实现post传递参数
Mar 12 Javascript
dedecms页面如何获取会员状态的实例代码
Mar 15 Javascript
使用jQuery5分钟快速搞定双色表格的简单实例
Aug 08 Javascript
bootstrap table 多选框分页保留示例代码
Mar 08 Javascript
JS实现前端缓存的方法
Sep 21 Javascript
JS实现table表格固定表头且表头随横向滚动而滚动
Oct 26 Javascript
Angular4学习教程之HTML属性绑定的方法
Jan 04 Javascript
Vue中的slot使用插槽分发内容的方法
Mar 01 Javascript
JavaScript事件对象深入详解
Dec 30 Javascript
layui 上传插件 带预览 非自动上传功能的实例(非常实用)
Sep 23 Javascript
基于Vue CSR的微前端实现方案实践
May 27 Javascript
手写Spirit防抖函数underscore和节流函数lodash
Mar 22 Javascript
一道面试题引发的对javascript类型转换的思考
Mar 06 #Javascript
JavaScript函数参数的传递方式详解
Mar 06 #Javascript
jQuery实现遍历复选框的方法示例
Mar 06 #Javascript
jQuery.cookie.js使用方法及相关参数解释
Mar 06 #Javascript
jQuery Validate 相关参数及常用的自定义验证规则
Mar 06 #Javascript
jQuery简单实现遍历单选框的方法
Mar 06 #Javascript
jQuery在header中设置请求信息的方法
Mar 06 #Javascript
You might like
php中看实例学正则表达式
2006/12/25 PHP
linux iconv方法的使用
2011/10/01 PHP
解析mysql中UNIX_TIMESTAMP()函数与php中time()函数的区别
2013/06/24 PHP
PHP二维数组排序的3种方法和自定义函数分享
2014/04/09 PHP
php将csv文件导入到mysql数据库的方法
2014/12/24 PHP
PHP如何使用Memcached
2016/04/05 PHP
PHP简单验证码功能机制实例详解
2019/03/27 PHP
Laravel5.5 视图 - 创建视图和数据传递示例
2019/10/21 PHP
js触发asp.net的Button的Onclick事件应用
2013/02/02 Javascript
多种方法实现JS动态添加事件
2013/11/01 Javascript
jquery 为a标签绑定click事件示例代码
2014/06/23 Javascript
js实现选中复选框文字变色的方法
2015/08/14 Javascript
AngularJS实现注册表单验证功能
2017/10/16 Javascript
解决vue+element 键盘回车事件导致页面刷新的问题
2018/08/25 Javascript
Vue+Webpack完美整合富文本编辑器TinyMce的方法
2018/11/30 Javascript
通过javascript实现段落的收缩与展开
2019/06/26 Javascript
vue动态路由:路由参数改变,视图不更新问题的解决
2019/11/05 Javascript
vue 项目打包时样式及背景图片路径找不到的解决方式
2019/11/12 Javascript
JavaScript函数Call、Apply原理实例解析
2020/02/17 Javascript
[01:07]2015国际邀请赛 中国区预选赛精彩回顾
2015/06/15 DOTA
[56:58]VP vs Optic 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
python定向爬虫校园论坛帖子信息
2018/07/23 Python
Python中的Socket 与 ScoketServer 通信及遇到问题解决方法
2019/04/01 Python
Opencv实现抠图背景图替换功能
2019/05/21 Python
jupyter notebook 参数传递给shell命令行实例
2020/04/10 Python
python中get和post有什么区别
2020/06/19 Python
HTML5应用之文件上传
2016/12/30 HTML / CSS
Linux文件系统类型
2012/02/15 面试题
财务副总经理工作职责
2013/11/25 职场文书
先进个人事迹材料
2014/01/25 职场文书
商场促销活动方案
2014/02/08 职场文书
初中升旗仪式演讲稿
2014/05/08 职场文书
环卫工人先进事迹材料
2014/06/02 职场文书
三人合伙协议书范本
2014/10/29 职场文书
2015年保险业务员工作总结
2015/05/27 职场文书
使用ORM新增数据在Mysql中的操作步骤
2021/07/26 MySQL