1、问题背景

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

2、实现源码

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>查找标题</title>
  6. <script type="text/javascript" src="js/jquery-2.2.3.js" ></script>
  7. <script>
  8. $(function(){
  9. //查找h1-h6
  10. $(":header").each(function(){
  11. $(this).click(function(event){
  12. console.info(event.target.innerText);
  13. console.log(event.currentTarget.innerHTML);
  14. });
  15. });
  16. });
  17. </script>
  18. </head>
  19. <body>
  20. <h1>Hello H1</h1>
  21. <h2>Hello H2</h2>
  22. <h3>Hello H3</h3>
  23. <h4>Hello H4</h4>
  24. <h5>Hello H5</h5>
  25. <h6>Hello H6</h6>
  26. </body>
  27. </html>

3、实现结果

4、结果说明

（1）$(":header")

选择所有标题元素

（2）each函数

遍历h1-h6

（3）event.target.innerText

获取点击元素内容内容

（4）event.currentTarget.innerHTML

获取点击元素内容内容

版权声明：本文为博主原创文章，未经博主允许不得转载。

利用：header匹配所有标题做目录的更多相关文章

  1. treeview自动从表中添加标题和列值做目录的方法2

    treeview自动从表中添加标题和列值做目录的方法2,该方法是借鉴万一老师的 http://www.cnblogs.com/del/archive/2008/05/15/1114450.html 首 ...

  2. 利用rman进行异机还原(目录相同)

    利用rman进行异机还原(目录相同) 源始库:192.168.201.2 目标库:192.168.201.3 --192.168.201.2 --rman [oracle@db01 ~]$ rman ...

  3. poj 2446 Chessboard (二分图利用奇偶性匹配)

    Chessboard Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 13176   Accepted: 4118 Descr ...

  4. 京东无人超市的成长之路 如何利用AI技术在零售业做产品创新？

    随着消费及用户体验的需求升级.人货场的运营效率需求提升.人工智能技术的突破以及零售基础设施的变革等因素共同推动了第四次零售革命的到来,不仅在国内,国外一线巨头互联网亚马逊等企业都在研发无人驾驶.无人超 ...

  5. Jqgrid利用正则匹配表达式正确移除html标签

    在使用JqGrid表格插件过程中,遇到一个问题:后台取出来的字段是带有Html标签的,于是将内容填充到表格之后,带有的html标签会把表格撑开或者每一行的内容显示不统一,导致非常难看,就像下图所示: ...

  6. 利用基准电压效正Vcc做参考电压的ADC采样计算方法

    利用基准电压效正Vcc做参考电压的ADC采样计算方法

  7. UIView封装动画--iOS利用系统提供方法来做转场动画

    UIView封装动画--iOS利用系统提供方法来做转场动画 UIViewAnimationOptions option; if (isNext) { option=UIViewAnimationOpt ...

  8. UIView封装动画--iOS利用系统提供方法来做关键帧动画

    iOS利用系统提供方法来做关键帧动画 ios7以后才有用. /*关键帧动画 options:UIViewKeyframeAnimationOptions类型 */ [UIView animateKey ...

  9. UIView封装动画--iOS 利用系统提供方法来做弹性运动

    iOS 利用系统提供方法来做弹性运动 /*创建弹性动画 damping:阻尼,范围0-1,阻尼越接近于0,弹性效果越明显 velocity:弹性复位的速度 */ [UIView animateWith ...

随机推荐

  1. 详解php的魔术方法__get()和__set()

    先看看php官方文档的解释:__set() is run when writing data to inaccessible properties.__get() is utilized for re ...

  2. Windows编译OpenSSL

    安装说明參考openssl源代码目录下INSTALL.W32 step1 环境搭建 安装perl,Visual Studio 2008 下载Openssl最新版源代码.我下的版本号为OpenSSL-1 ...

  3. tmux入门 ： 3. 会话

      上一节我们已经将 tmux 安装好了,现在就可以通过以下命令来启动它: $ tmux 启动之后,可以看到命令行最底部多了一条绿色的状态条,上面显示了一些信息,比如计算机名和时间等. 要退出 tmu ...

  4. 如何设置outlook实现自动秘密抄送邮件的功能？

    很多朋友会发现虽然在家里同步了公司的邮箱可以正常收发邮件,可是每当使用家里的outlook发送相关邮件的时候,在公司的邮箱里找不到相关的发件记录,只能同步收件箱,而不能同步发件箱应该是比较让人困扰的问 ...

  5. Java之内部类(1) - 为什么需要内部类

    为什么需要内部类 一般来说,内部类继承自某个类或实现某个接口,内部类的代码操作创建它的外围类的对象.所以可以认为内部类提供了某种进入其外围类的窗口. 内部类必须要回答的一个问题是:如果只是需要一个对接 ...

  6. E492: Not an editor command: ^M

    在windows下拷贝vimrc到Linux,运行vim命令后,出现错误 vim E492: Not an editor command: ^M 原因: linux的文件换行符为\n,但windows ...

  7. Visual studio之C# 调用系统软键盘（外部"osk.exe"）

    背景 App需要调用系统软键盘输入数据,自己去实现软键盘有些复杂,现在又是急需,没时间去研究实现软键盘,所以只能调用系统软键盘. 正文 需要添加命名空间, using System.Diagnosti ...

  8. Python-理解装饰器

    文章先由stackoverflow上面的一个问题引起吧,如果使用如下的代码: @makebold @makeitalic def say(): return "Hello" 打印出 ...

  9. Python-编码之大彻大悟

    1.了解各种编码的来历及其在计算机内部的存储: http://www.cnblogs.com/JohnABC/p/3507219.html http://www.ruanyifeng.com/blog ...

  10. excel合并单元格

    最简单的: =A1&B1&C1 在C14单元格中输入公式:=CONCATENATE(A14,"@",B14,".com"),确认后,即可将A14 ...