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 相关文章推荐
javascript实现unicode和字符的互相转换
Jul 18 Javascript
jquery ajax对特殊字符进行转义防止js注入使用示例
Nov 21 Javascript
关于js中for in的缺陷浅析
Dec 02 Javascript
实例代码讲解jquery easyui动态tab页
Nov 17 Javascript
JS字符串false转boolean的方法(推荐)
Mar 08 Javascript
整理关于Bootstrap导航的慕课笔记
Mar 29 Javascript
JavaScript如何一次性展示几万条数据
Mar 30 Javascript
详解Vue.js之视图和数据的双向绑定(v-model)
Jun 23 Javascript
JavaScript常见鼠标事件与用法分析
Jan 03 Javascript
js设计模式之代理模式及订阅发布模式实例详解
Aug 15 Javascript
微信接入之获取用户头像的方法步骤
Sep 23 Javascript
Vue 设置axios请求格式为form-data的操作步骤
Oct 29 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读取csv文件后,uft8 bom导致在页面上显示出现问题的解决方法
2013/08/10 PHP
php防止sql注入示例分析和几种常见攻击正则表达式
2014/01/12 PHP
Yii2中DropDownList简单用法示例
2016/07/18 PHP
Thinkphp自定义生成缩略图尺寸的方法
2019/08/05 PHP
JavaScript更改原始对象valueOf的方法
2015/03/19 Javascript
jQuery滚动条插件nanoscroller使用指南
2015/04/21 Javascript
浅谈JavaScript 的执行顺序
2015/08/07 Javascript
jQuery控制li上下循环滚动插件用法实例(附demo源码下载)
2016/05/28 Javascript
H5实现中奖记录逐行滚动切换效果
2017/03/13 Javascript
微信、QQ、微博、Safari中使用js唤起App
2018/01/24 Javascript
node.js到底要不要加分号浅析
2018/07/11 Javascript
node版本管理工具n包使用教程详解
2018/11/09 Javascript
JS双向链表实现与使用方法示例(增加一个previous属性实现)
2019/01/31 Javascript
Vue中Table组件Select的勾选和取消勾选事件详解
2019/03/19 Javascript
antd vue table跨行合并单元格,并且自定义内容实例
2020/10/28 Javascript
vue使用exif获取图片经纬度的示例代码
2020/12/11 Vue.js
[04:02]DOTA2上海特锦赛小组赛第二日recap精彩回顾
2016/02/28 DOTA
Python中operator模块的操作符使用示例总结
2016/06/28 Python
python:pandas合并csv文件的方法(图书数据集成)
2018/04/12 Python
python pycurl验证basic和digest认证的方法
2018/05/02 Python
Python列表解析配合if else的方法
2018/06/23 Python
python使用phoenixdb操作hbase的方法示例
2019/02/28 Python
anaconda如何查看并管理python环境
2019/07/05 Python
python多线程扫描端口(线程池)
2019/09/04 Python
pytorch 实现cross entropy损失函数计算方式
2020/01/02 Python
Python新手学习标准库模块命名
2020/05/29 Python
Android Q之气泡弹窗的实现示例
2020/06/23 Python
html5摇一摇代码优化包括DeviceMotionEvent等等
2014/09/01 HTML / CSS
Crocs波兰官方商店:女鞋、男鞋、童鞋、洞洞鞋
2019/10/08 全球购物
奥林匹克运动会口号
2014/06/19 职场文书
合唱兴趣小组活动总结
2014/07/10 职场文书
三人合伙协议书范本
2014/10/29 职场文书
2015年度质量工作总结报告
2015/04/27 职场文书
离婚起诉书怎么写
2015/05/19 职场文书
红色革命电影观后感
2015/06/18 职场文书
python中__slots__节约内存的具体做法
2021/07/04 Python