javascript14--classlist

最新推荐文章于 2024-06-14 20:36:20 发布

lxhby520

最新推荐文章于 2024-06-14 20:36:20 发布

阅读量360

点赞数

分类专栏： javascript 小白

本文链接：https://blog.csdn.net/lxhby520/article/details/80407934

版权

小白同时被 2 个专栏收录

37 篇文章 0 订阅

订阅专栏

javascript

33 篇文章 0 订阅

订阅专栏

classlist

<style>
    body,dl,dd,p,h1,h2,h3,h4,h5,h6{margin:0;}
    ol,ul,li{margin:0;padding:0;list-style:none;}
    img{border:none;vertical-align:top;}
    .box{
      width:100px ;
      height: 100px;
      border: 1px solid #000;
    }
   .box.on{
     background-color: #f60;
    }
  </style>
</head>
<body>
  <div class="box"></div>
</body>
<script>
  var box = document.getElementsByClassName("box")[0];
  box.cname = box[0].className;
  box.onmouseenter = function () {
      this.className = this.cname+" on";//注意加空格
  }
  box.onmouseleave = function () {
      this.className = this.cname;
  }
</script>

但如果默认是on状态 <div class="box on"></div>并且忘了之前取的名字

每个元素身上都有一个Domtokenlist（标记列表）是一个类数组，存储着该元素的所有类名并且索引--值的形式储存

for循环
删/修改/查找/增加
我们不能直接修改classlist和增加classlist当中的类名 box.classList[2]="lisi"这样并不会增加第三个类名
判断有没有类名 ele.classList.containts("类名") 返回值是false 或者trueconsole.log(box.classList.contains("lisi"));
获取类名 ele.classList.item(0) 传索引值 console.log(box.classList.item(0));相当于ele.classList[0]
增加类名 ele.classList.add("类名") 增加类名从后面加
删除类名 ele.classList.remove
切换类名 ele.classList.toggle("类名") 有则改之无责加勉如果有类名则删除如果没有类名则加上
只知道索引怎么删呢？ ele.classList.remove(ele.classList.item(0));
如果加类名一定要记住一次只能加不能一次加多个 box.classList.add("lisi" "wangwu")

math

math 是js内置的一个对象是包含数学方法的一个对象
console.log(Math.random());打印会发现是个大于0 的小数刷新后数字会变化Math.random()返回一个[0,1) 能取到0，永远取不到1 一个16位小数的伪随机数Math.random()括号里面不接受传参
如果要取5-10 console.log(Math.random()*5+5);
Math.floor() 向下取整舍去小数取整数 console.log(Math.floor(5.11));结果是5
Math.ceil 向上取整不管小数有多小向上取整 console.log(Math.ceil(5.00011));结果是6
Math.trunc()舍去小数当都是正数时和floor效果一样但是当是负数时候console.log(Math.floor(-5.00011)); 结果是-6 console.log(Math.trunc(-5.00011));结果是-5
Math.round()四舍五入
Math.cos()
Math.sin()
Math.tan()
Math.abs()绝对值
Math.max() 取最大值
Math.min()
Math.sqrt()平方根
Math.cbrt()立方根
Math.pI()