<!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. javascript中两种基本常用排序算法分析

    备注:内容大部分从网上复制,代码为自己手写.仅做知识的温故知新,并非原创. 1.冒泡排序(Bubble Sort) (1)算法描述 冒泡排序是一种简单的排序算法.它重复地走访过要排序的数列,一次比较两 ...

  2. mui实现图片更换（暂未上传）

    页面中有默认的图片,触发type为file的input时,更换图片,这个是mui移动端的项目,算了,不多说,开码 首先,先在html页面中设置样式,样式我就不给了,贴个布局 <div class ...

  3. Ubuntu 11.04源

    ##国内源#这个北京交通大学的源也挺不错的,我们首选这个,速度很不错deb http://mirror.bjtu.edu.cn/ubuntu/ narwhal multiversedeb http:/ ...

  4. zabbix2升级zabbix3

    1.停服zabbix2,停服数据库/etc/init.d/zabbix_server stop/etc/init.d/mysqld stop 2.物理备份数据库cd /var/lib/mysql/ta ...

  5. 常用css和js组件

    1 . input框中插入图标 <div class="col-sm-12 col-xs-12 setLineHeight"> <div class=" ...

  6. jsp四大作用域之request

    <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding= ...

  7. 【Windows 10 v1703】解决桌面出现Removable Storage Devices的问题

    症状如下: 右键没有正常菜单,不能查看属性. 不能通过文件树找到这个文件夹. 出现原因不明. 暂时的解决方案: 右键,新建一个快捷方式.然后将快捷方式拖进垃圾桶,删除.这个文件夹将会被连带删除. 感谢 ...

  8. SAP Cloud for Customer客户主数据的重复检查-Levenshtein算法

    SAP C4C的客户主数据创建时的重复检查,基于底层HANA数据库的模糊查找功能,根据扫描数据库中已有的数据检测出当前正在创建的客户主数据是否和数据库中记录有重复. 在系统里开启重复检查的配置: 在此 ...

  9. 前端面试题总结（二）CSS篇

    前端面试题总结(二)CSS篇 一.link和@import的区别? link属于HTML标签,可以引入出css以外的事务,如RSS,而@import是css提供的,只能加载css文件. link会在页 ...

  10. Codeforces Round #320 (Div. 1) [Bayan Thanks-Round] C A Weakness and Poorness （三分）

    显然f(x)是个凹函数,三分即可,计算方案的时候dp一下.eps取大了会挂精度,指定循环次数才是正解. #include<bits/stdc++.h> using namespace st ...