你所不知道的小知识_id和dataid区别-CSDN博客

本文链接：https://blog.csdn.net/qq_40282016/article/details/116159038

HTML

1.class和id的区别

id是唯一的，也就是说同一页面中不允许出现同样名字的id；
class是可多用性的，比如三个div都命名同一个class，然后你只需要对这一个class设置样式即可，然而id不可以。

2.div和span的区别

div占用的位置是一行
span占用的是内容有多宽就占用多宽的空间距离
div是一个块级元素，用来为HTML文档内大块的内容提供结构和背景
span是行内元素，在行内定义一个区域（也就是一行内可以被划分好几个区域）
div标签中可以镶嵌span标签，（div可以看做是一个大容器，span是一个小容器，大容器当然可以放下一个小容器啦）

3.html中script标签的作用

HTML的Script标签用于定义客户端脚本,比如 JavaScript。
脚本(Script)是一种批处理文件的延伸,是一种纯文本保存的程序

4.link标签
链接一个外部样式表

5.div#e1+div#e2+div#e3 +tab
快速创建3个div

6.const childNodes = node.childNodes
简写为：const { childNodes } = node
获取node里面的所有孩子

CSS

1.background: transparent;
将背景变透明

2.border-radius: 50%;
变成圆

3.时间延迟
setTimeout(()=>{fn},1000)

JavaScript

1.document.querySelector()
文档对象模型Document引用的querySelector()方法返回文档中与指定选择器或选择器组匹配的第一个 HTMLElement对象。如果找不到匹配项，则返回null。

2.innerText和innerHTML的区别

innerText主要是设置文本的，甚至标签内容，是没有标签的效果的。
innerHTML主要的作用是在标签中设置新的heml标签内容，是有标签效果的

3.JSON.stringify()
用于将 JavaScript 值转换为 JSON 字符串。

4.JS的一个函数是可以接受多个参数的
重载：根据参数个数写不同的代码

  attr(node, name, value) {
    if (arguments.length === 3) {
      //参数长度
      return node.setAttribute(name, value);
    } else if (arguments.length === 2) {
      return node.getAttribute(name);
    }
  },

5.适配

text(node, string) {
    //适配
    if ("innerText" in node) {
      //浏览器是否有innerText
      node.innerText = string; //ie
    } else {
      node.textContent = string; //firefox chrome
    }
  }