JS---DOM---自定义属性引入和移除
总结:在html标签中添加的自定义属性, 如果想要获取这个属性的值, 需要使用getAttribute("自定义属性的名字")才能获取这个属性的值
- html标签中有没有什么自带的属性可以存储成绩的----没有
- 本身html标签没有这个属性, 自己(程序员)添加的----自定义属性---为了存储一些数据
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title></title>
<style>
ul {
list-style-type: none;
cursor: pointer;
}
</style>
</head> <body>
<ul>
<li score="60">张三的数学成绩</li>
<li score="90">赵四的数学成绩</li>
<li score="90">王五的数学成绩</li>
<li score="80">唐七的数学成绩</li>
<li score="50">宋八的数学成绩</li>
</ul>
<script src="common.js"></script>
<script>
var list = document.getElementsByTagName("li");
for (var i = 0; i < list.length; i++) {
list[i].onclick = function () {
// alert(this.score);//弹出undefined
alert(this.getAttribute("score"));
};
}
</script>
</body>
移除自定义属性:removeAttribute("属性的名字")
<input type="button" value="移除自定义属性" id="btn" />
<div id="dv" score="80分" class="cls"></div>
<script src="common.js"></script>
<script>
my$("btn").onclick = function () {
// my$("dv").removeAttribute("score");
// my$("dv").className = "";
//也可以移除元素的自带的属性
my$("dv").removeAttribute("class");
};
</script>
JS---DOM---自定义属性引入和移除的更多相关文章
- js介绍,js三种引入方式,js选择器,js四种调试方式,js操作页面文档DOM(修改文本,修改css样式,修改属性)
js介绍 js运行编写在浏览器上的脚本语言(外挂,具有逻辑性) 脚本语言:运行在浏览器上的独立的代码块(具有逻辑性) 操作BOM 浏览器对象盒子 操作DOM 文本对象 js三种引入方式 (1)行间式: ...
- JS DOM(文档对象模型)与BOM(浏览器对象模型)
在JS中,对DOM(Document Object Model)对象和BOM(Browser Object Model )对象的操作是非常重要的内容.DOM主要包括HTML文档的属性和方法,像对HTM ...
- JS DOM操作(创建、遍历、获取、操作、删除节点)
创建节点 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="u ...
- 货架工程项目之js dom实现项目工程进度图
笔者最近要负责有个项目工程网站的安装进度过程,实现的效果要求大概如下图所示 由于笔者没有参与到数据库的制作,得知他们这个项目设计工序的时候就一个开始日期的和完成日期,连整个项目的安装结束时间都没有简直 ...
- js DOM优化相关探索
我在这尝试两个方面:-->DOM与js -->DOM与浏览器 (最近在秒味视频上学到不少,哈哈哈) 一.DOM与js 1.js与dom的交互问题 频繁的与dom交互,是一件浪费时间与金钱的 ...
- 关于Yii2中CSS,JS文件的引入心得
js和css的引入 use yii\helpers\Html; 1.全局引入,所有的view生效 /assets/AppAsset.php public $css = [ 'css/site.css' ...
- js DOM的几个常用方法
<div id="div1">这是个测试</div> <p </p> <p </p> //js DOM的几个常用方法 / ...
- JS DOM 来控制HTML元素
JS DOM 来控制HTML元素 (ps:这个有很多方法,挑一些详解,嘻嘻) 1.getElementsByName():获取name. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...
- JS Dom节点操作demo!
通过黑马课程的学习,在这里分享一个js Dom中节点操作的小练习 需求:使用js创建一个4*3的表格table. onload = function(){ function c(tagName){ r ...
- 怎样使用自定义标签简化 js、css 引入?
国庆将至,工作兴致全无,来总结点项目里平时不起眼干货. 前端引入 js .css 一般是这样: <script type="text/javascript" src=&quo ...
随机推荐
- 华为云DevCloud为开发者提供高效智能的可信开发环境
在HUAWEI CONNECT 2019期间,在华为云云服务开发者分论坛上,华为云布道师做了<CloudIDE:开发者的高效.智能的可信开发环境>专题演讲,主要介绍了华为云DevCloud ...
- CarbonData:大数据融合数仓新一代引擎
[摘要] CarbonData将存储和计算逻辑分离,通过索引技术让存储和计算物理上更接近,提升CPU和IO效率,实现超高性能的大数据分析.以CarbonData为融合数仓的大数据解决方案,为金融转型打 ...
- Docker Compose集成式应用组合及service编排
Compose简介 Compose项目是Docker官方的开源项目,负责实现对Docker容器集群的快速编排.其代码目前在 https://github.com/docker/compose 开源.C ...
- GIS学习汇总
GIS之家: Geoserver: geoserver安装部署步骤 geoserver发布地图服务WMS geoserver发布地图服务WMTS geoserver集成以及部署arcgis serve ...
- csuoj-1900 锋芒毕露
Description 小闪最近迷上了二刀流——不过他耍的其实是剑——新买了一个宝库用来专门存放自己收集的双剑.一对剑有两把,分只能左手用的和只能右手用的,各自有一个攻击力数值.虽然一对剑在小闪刚拿到 ...
- ARTS-S golang goroutines and channels(一)
先用golang实现一个简单的tcp服务端,假定文件名为clock1.go // clock1.go package main import ( "fmt" "io&qu ...
- shell脚本调用python模块
python helloworld.py代码为 # coding:utf-8 from __future__ import print_function import sys print(sys.pa ...
- 【Vuejs】350- 学习 Vue 源码的必要知识储备
前言 我最近在写 Vue 进阶的内容.在这个过程中,有些人问我看 Vue 源码需要有哪些准备吗?所以也就有了这篇计划之外的文章. 当你想学习 Vue 源码的时候,需要有扎实的 JavaScript 基 ...
- 【Webpack】320- Webpack4 入门手册(共 18 章)(下)
介绍 1. 背景 最近和部门老大,一起在研究团队[EFT - 前端新手村]的建设,目的在于:帮助新人快速了解和融入公司团队,帮助零基础新人学习和入门前端开发并且达到公司业务开发水平. 本文也是属于[E ...
- KafkaManager2.0.0.2安装与使用
KafkaManager 是雅虎开源的一款 针对kafka集群的web管理工具, 具体功能和介绍就不再这细讲 kafka-manager github官网 https://github.com/ya ...