欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

js 自定义属性

程序员文章站 2023-02-25 10:54:16
html标签中有没有什么自带的属性可以存储成绩的 没有 本身html标签没有这个属性,自己(程序员)添加的, 自定义属性 为了存储一些数据 在html标签中添加的自定义属性,如果想要获取这个属性的值,需要使用getAttribute("自定义属性的名字")才能获取这个属性的值 使用方法: 设置自定义 ......
 html标签中有没有什么自带的属性可以存储成绩的----没有
 本身html标签没有这个属性,自己(程序员)添加的,----自定义属性---为了存储一些数据
 在html标签中添加的自定义属性,如果想要获取这个属性的值,需要使用getattribute("自定义属性的名字")才能获取这个属性的值
 
使用方法:
  设置自定义属性:setattribute("属性的名字","属性的值");
  获取自定义属性的值:getattribute("属性的名字")
<ul id="uu">
  <li score="10">小明的数学成绩</li>
  <li score="20">小红的数学成绩</li>
  <li score="30">小绿的数学成绩</li>
  <li score="40">小黄的数学成绩</li>
  <li score="50">小琴的数学成绩</li>
</ul>
//根据id获取ul标签,并且或者该标签中所有的li
  var list=document.getelementbyid("uu").getelementsbytagname("li");
  //循环遍历
  for(var i=0;i<list.length;i++){
    //先为每个li添加自定义属性
    //list[i].score=(i+1)*10;
    //此方式,自定义属性在dom对象上,不在标签中
    //用setattribute去设置自定义属性的值
    list[i].setattribute("score",(i+1)*10);
    //点击每个li标签,显示对应的自定义属性值
    list[i].onclick=function(){
      //getattribute获取每个对应的自定义属性的值
      alert(this.getattribute("score"));
    };
  }
 
移除自定义属性:removeattribute("属性的名字")
//点击按钮移除元素的自定义属性
  document.getelementbyid("btn").onclick=function () {
    //my$("dv").removeattribute("score");
    //移除元素的类样式
    //值没有了,但是属性还是有的
    //my$("dv").classname="";
    //也可以移除元素的自带的属性
    document.getelementbyid("btn").removeattribute("class");
  };