2021-07-23

排他思想

就是选取全部来进行使用，通过for的语句选择全部

1 2 3 4 5   百度的换肤模板 

点击某一个照片之后就会换成这个照片，特别好用

全选的使用案例

商品	价钱

## 自定义属性  包含有index属性的东西是自定义的属性，可以自己定义这样子的 getAttribute就是用来获取自定义属性的按钮 **移除属性值：**  class属性比较特殊，不是使用的是className的属性，而是使用原来的class来进行修改 

• 规格和包装
• 售后保障
• 商品评价
• 手机社区

进行 Tab的工具栏修改

节点操作

主要作用就是获取元素

节点需要包含以下的内容值，就是节点名称，属性，节点值啥的啥的

获取父节点

//获取父节点

    </span>
</div>
<script>
    var box = document.querySelector('.box');
    box.parentNode;
    //这一步就获取完毕
</script>

如果获取不到的话返回的值就是为空

获取子节点

如图所示，和获取父节点的方式是一样的

parent.node.chrild只会返回子节点的东西其他东西不返回
新浪的下拉菜单的案例

微博

• 你好
• 圈我
• 打给我

•   nextsibing得到的是下一个兄弟节点，给人的感觉就是这样的 兄弟节点介绍其同放向的一个节点，具有同种关系  nextElementSiVing得到的是下一个兄弟的元素节点

  节点操作之创建和添加节点

  
  在评论区里留评论的时候，多会这样子的使用到，就要人工创建一个节点来保存内容
  在创建节点之后要做的就是添加节点了，要把你创建的节点添加到你想要的地方去

  添加节点

  

  
  

  //创建子节点

  案例留言板内容

  123 发布

  • </ul>
    <script>
        var btn = document.querySelector('button');
        var text = document.querySelector('textarea');
        var ul =document.querySelector('ul');
        //注册事件
        btn.onclick = function () {
           if(text.value == '') {
               alert('您没有输入内容');
               return false;
           }else {
               var li =document.createElement('li');
               ul.appendChild(li);
               li.innerHTML =text.value;
           }
          
        }
    </script>