zoukankan      html  css  js  c++  java
  • a属性+DOM创建回流+动画运动+

    超链接a的属性 href分析:

      < a  href = " " >   点击刷新页面,相当于向后台发送了一次请求

      < a  href = " # " >   锚点跳转,跳到叫ID为。。的位置上

      < a  href = " Javascript:; " >  取消刷新页面

    拓展:

      字符串拼接和DOM创建都是渲染的方式

      字符串拼接:

        优:简单,层次感强,可以处理大量数据

        缺:影响到原有子元素的事件

      DOM创建:

        优:是一个独立的个体,不会影响到原有元素

        缺:处理数据量过大比较麻烦,造成DOM回流

      DOM回流:

        页面渲染时,我们对HTML结构简单的增删查改时

        浏览器会对所有DOM进行重新排列,严重影响浏览器性能

    提升浏览器性能优化:

      多采用雪碧图;

      阻止超链接的默认行为

      减少DOM回流

      减少向服务器的请求次数

    动画——

      1,css样式提供了运动

        过渡属性 transition,从一种情况到另一种情况叫过渡

        transition:attr liner delay

        attr:是变化的属性

        time:是花费的时间

        linear:是变化的过渡

        delay:是延迟

      2,js提供的运动

        元素client,offset,scroll三个系列:

          clientWidth;clientHeight;clientTop;clientLeft

          offsetWidth;offsetHeight;offsetTop;offsetLeft;offsetParent

          scrollWidth;scrollHeight;scrollTop;scrollLeft

          十三个属性,前面是一个只读属性,scrollTop;scrollLeft 可读可写

          scrollTop;scrollLeft最小值是 0

    获取body整个文档的高:

      document.body.scrollHeight || document.documentElement.scrollHeight

    获取浏览器一屏幕的高(浏览器可视区):

      document.body.clientheight || document.documentelement.clientheight

    window下的两个事件:

      onscroll  当滚动条滚动时触发

      onresize  当窗口发生改变时触发

  • 相关阅读:
    杭电1827
    hdu 3118
    poj 2060
    hdu 2236
    poj 2226
    poj 1719
    poj 1466
    poj 3160
    骑士飞行棋笔记
    基础测试学习笔记
  • 原文地址:https://www.cnblogs.com/xiaotaiyangye/p/10039489.html
Copyright © 2011-2022 走看看