<!DOCTYPE html>

<html>

<head>

<script>

function showDetails(animal) {

    var animalType = animal.getAttribute("data-animal-type");

    alert("The " + animal.innerHTML + " is a " + animalType + ".");

}

</script>

</head>

<body>

<h1>Species</h1>

<p>Click on a species to see what type it is:</p>

<ul>

  <li onclick="showDetails(this)" id="owl" data-animal-type="bird">Owl</li>

  <li onclick="showDetails(this)" id="salmon" data-animal-type="fish">Salmon</li>

  <li onclick="showDetails(this)" id="tarantula" data-animal-type="spider">Tarantula</li>

</ul>

<h2 onclick="showDetails(this)" data-animal-type="第2级标题的子标题">第2级标题</h2>

</body>

</html>

html 标签附加文本属性的更多相关文章

  1. 盒子总结,文本属性操作,reset操作,高级选择器,高级选择器优先级,边界圆角(了解),a标签的四大伪类,背景图片操作,背景图片之精灵图

    盒子总结 ''' block: 设置宽高 1.没有设置宽,宽自适应父级的宽(子级的border+padding+width=父级的width) 2.没有设置高,高由内容撑开 设置了宽高 一定采用设置的 ...

  2. jQuery-对标签元素 文本操作-属性操作-文档的操作

    一.对标签元素文本操作 1.1 对标签中内容的操作 // js var div1 = document.getElementById("div1"); div1.innerText ...

  3. 关于html与css的标签及属性（text文本属性、背景background属性、表格标签table、列表、）

    text文本属性1.颜色 colorcolor:red: 2.文本缩进text-indant属性值 num+px text-indant:10px:3.文本修饰 text-decoration属性值: ...

  4. JAVAWEB开发之JSTL标签库的使用、 自己定义EL函数、自己定义标签（带属性的、带标签体的）

    JSTL  JSTL简单介绍: JSTL的全称:JSP Standard Tag Library,JSP标准标签库 JSTL的作用:   提供给Java Web开发者一个标准通用的标签函数库   和E ...

  5. css文本属性

    CSS1&2中的文本属性 属性 版本 简介 text-indent CSS1 检索或设置对象中的文本的缩进 letter-spacing CSS1 检索或设置对象中的文字之间的间隔 word- ...

  6. HTML <input> 标签的 type 属性

    HTML <input> 标签的 type 属性 HTML <input> 标签 实例 下面的表单拥有两个输入字段以及一个提交按钮: <form action=" ...

  7. Web前端新人笔记之文本属性

    前一段时间因工作时间减缓了更新笔记的时间.我也不知道有没有会观看并且能不能帮到一些初学者,这只是我的一些小随笔而已.当然我也希望的的每一篇随笔都可以帮到更多的想要学习前端开发的初学者们,更希望你们也可 ...

  8. HTML<label> 标签的 for 属性

    定义和用法 for 属性规定 label 与哪个表单元素绑定. 隐式和显式的联系 标记通常以下面两种方式中的一种来和表单控件相联系:将表单控件作为标记标签的内容,这样的就是隐式形式,或者为 <l ...

  9. UIlabel - 富文本属性

    1.NSKernAttributeName: @10 调整字句 kerning 字句调整 2.NSFontAttributeName : [UIFont systemFontOfSize:_fontS ...

随机推荐

  1. 从零开始的Lua宅[1]：编译Lua解释器

    Lua是一门神奇的脚本语言,游戏宅必备,懒人必备.Lua差多不是学起来用起来最简单的语言了,以至于简单到自身就是文档,自身就是配置文件.但是Lua的运行效率却是众多脚本中非常高的,据说仅次于V8爹下的 ...

  2. 洛谷 P1145 约瑟夫

    题目描述 n个人站成一圈,从某个人开始数数,每次数到m的人就被杀掉,然后下一个人重新开始数,直到最后只剩一个人.现在有一圈人,k个好人站在一起,k个坏人站在一起.从第一个好人开始数数.你要确定一个最小 ...

  3. Java 设计模式之中介者模式

    本文继续23种设计模式系列之中介者模式.   定义 用一个中介者对象封装一系列的对象交互,中介者使各对象不需要显示地相互作用,从而使耦合松散,而且可以独立地改变它们之间的交互.   角色 抽象中介者: ...

  4. HDU 5091 Beam Cannon （扫描线思想）

    题意:移动一个矩形,使矩形内包含的点尽量多. 思路:把一个点拆成两个事件,一个进(权值为1)一个出(权值为-1),将所有点按照x排序,然后扫描,对于每个x,用一个滑窗计算一下最大值,再移动扫描线.树状 ...

  5. Cross-Entropy Loss 与Accuracy的数值关系（很重要，很好的博客）

    http://www.cnblogs.com/dengdan890730/p/6132937.html

  6. 安装python3.6 pip3 flake8

    apt-get install python3-pip # Python3 ➜  ~ pip3 -V                                             pip 9 ...

  7. openstack nova fail to create vm

    2019-05-13 14:43:27.017 47547 ERROR nova.compute.manager [req-3f1af0ed-c342-4cf3-8e76-6963053a5227 8 ...

  8. 用requests爬取图片

    # coding=utf-8 from bs4 import BeautifulSoup import requests import urllib x = 1 def crawl(url): res ...

  9. Web服务器 --> 基于HTTP的网站开发

    经过几十年的发展,已经出现几个成熟的处理HTTP的知名的Web服务器.这些服务器可以解析(handle)HTTP,当Web服务器接收到一个HTTP请求时,会根据配置的内容返回一个静态HTML页面或者调 ...

  10. Unity调用Windows窗口句柄，选择文件和目录

    T:2019-6-25 10:06:59 C:Scatt Kang using System; using System.Collections; using System.Collections.G ...