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. tee -a /var/log/jd.log

    原文: http://man.linuxde.net/tee --------------------------------------------------------------------- ...

  2. 直接插入排序、折半插入排序、shell插入排序

    直接插入排序:   折半插入排序:   shell插入排序:  

  3. 关于天津中软国际ETC培训中心的见与闻

    半个月的时间转眼即逝,在中软国际天津ETC的实训的两个星期就这样过去了,在中软国际天津站的这段时间也收获了非常多.明确了非常多,了解了很多关于社会就业的知识以及关于软件培训的一些事情.尽管我的了解可能 ...

  4. java 有用的类库

    import org.apache.commons.lang.StringUtils; 字符串库

  5. 【Linux】xshell连接中断后就无法连接虚拟机中的Linux

    具体情景是这样的: 在使用Linux的时候,本来一直好好的,突然就断了,我去百度了一番,网上的说法有千万种 有的说:是由于防火墙的问题 有的说:是由于Linux与其他ip冲突造成 ... 说法千万种, ...

  6. js取消radio选中 反选

    var radio=document.createElement("input");radio.type="radio";radio.onclick = fun ...

  7. Docker学习笔记之二，基于Dockerfile搭建JAVA Tomcat运行环境

    前言 在第一篇文字中,我们完全人工方式,一个命令一个命令输入,实现一个 java tomcat运行环境,虽然也初见成效,但很累人.如果依靠依靠脚本构建一个Tomcat容器实例,一个命令可以搞定,何乐而 ...

  8. 阿里云 oss python3 样例

    阿里云的oss SDK又是不支持python3,头疼头疼. 本想改一改它的SDK,让它支持python2+python3,无奈里面大量的代码使用不带括号的print.工作量恐怖. 幸好oss的使用很e ...

  9. C#实现播放声音的方法

    文章来自学IT网:http://www.xueit.com/html/2009-09/21_4598_00.html 在这里介绍使用C#实现播放声音的几种方法,都是利用组件等方法来实现的,有兴趣的话可 ...

  10. Postman---html中get和post的区别和使用

    get和post的区别和使用 Html中post和get区别,是不是用get的方法用post都能办到? Http定义了与服务器交互的不同方法,最基本的方法有4种,分别是GET,POST,PUT,DEL ...