超链接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  当窗口发生改变时触发

a属性+DOM创建回流+动画运动+的更多相关文章

  1. JavaEE XML DOM创建

    DOM创建XML @author ixenos 1.思路: 先封装构建一颗DOM树,然后将DOM树转换成XML文件 2.三种写DOM树到XML文件的方式: 1)使用DOM(或DOM4J.JDOM) 2 ...

  2. 创建帧动画1 - xml方式

    废话不多说,先看东西   创建帧动画1 - xml方式 帧动画的创建方式主要以下2种: * 用xml创建动画: * 用代码创建动画:   本文内容主要关注 xml文件 创建帧动画的方式   xml文件 ...

  3. PHP中利用DOM创建xml文档

    DOM创建xml文档 用dom创建如下文档: <booklist> <book id="1"> <title>天龙八部</title> ...

  4. Unity 2D骨骼动画2:创建真实动画

    http://bbs.9ria.com/thread-401781-1-1.html 在这个系列,我们将关注Unity引擎提供的基于骨骼动画工具.它的主要思想是为了把它应用到你自己的游戏来介绍和教基本 ...

  5. css 12-CSS3属性详解:动画详解

    12-CSS3属性详解:动画详解 #前言 本文主要内容: 过渡:transition 2D 转换 transform 3D 转换 transform 动画:animation #过渡:transiti ...

  6. Web动画API教程1:创建基本动画

    本人转载自: Web动画API教程1:创建基本动画

  7. 解决浏览器background-image属性不支持css3动画

    问题 最近在使用background-image属性来实现css3的逐帧动画时,碰到了个问题.在chrome浏览器上,background-image属性是支持css3动画的,但是到了firefox上 ...

  8. 练习:javascript-setInterval动画运动平移,定时器动画练习

    常见问题:定时器加速问题,每次点击会启动一个定时器,解决先清除定时器 <!DOCTYPE html> <html lang="en"> <head&g ...

  9. Scrollanim – CSS3 & JavaScript 创建滚动动画

    Scrollanim 是结合 CSS3 和 JavaScript 来创建令人惊叹的滚动动画的开源库. Scrolanim 支持在页面上的所有可用的元素的位置.有很多的自定义参数可以配置使用,构建出精彩 ...

随机推荐

  1. 使用Supervisor管理Django应用进程

    官方文档 1.安装 pip install supervisor 2.使用说明 2.1  查看默认配置 echo_supervisord_conf 一般情况下,不需要去修改默认配置,而是将默认配置重定 ...

  2. http协议 c++ 接收

    http消息格式:header+\r\n\r\n+ chunkLen + \r\n + chunkData + \r\n + chunkLen + \r\n + chunkData +\r\n + 0 ...

  3. Memcache未授权访问漏洞简单修复方法

    漏洞描述: memcache是一套常用的key-value缓存系统,由于它本身没有权限控制模块,所以开放在外网的memcache服务很容易被攻击者扫描发现,通过命令交互可直接读取memcache中的敏 ...

  4. NGUI里的sprite和label有白色的边框

    问题描述:NGUI里的sprite和label有白色的边框,而原图一切正常 如图: 解决方案: 给Sprite 边缘左右更增加1,这样拉伸的时候就忽略了左右1的位置,图片就不会显示白色边框了

  5. 费马平方和定理&&斐波那契恒等式&&欧拉四平方和恒等式&&拉格朗日四平方和定理

    费马平方和定理 费马平方和定理的表述是:奇素数能表示为两个平方数之和的充分必要条件是该素数被4除余1. 1. 如果两个整数都能表示为两个平方数之和的形式,则他们的积也能表示为两个平方数之和的形式. $ ...

  6. PyTorch学习之六个学习率调整策略

    PyTorch学习率调整策略通过torch.optim.lr_scheduler接口实现.PyTorch提供的学习率调整策略分为三大类,分别是 有序调整:等间隔调整(Step),按需调整学习率(Mul ...

  7. C/C++ 交换两个数,不使用第三个变量, 函数模板来实现

    #include <iostream> template<typename T> void exchangeTwoNumber(T &t1, T &t2): v ...

  8. 阿里云 azkaban 发邮件的坑

    azkaban : 是一个 任务调度平台 安装文档: https://azkaban.readthedocs.io/en/latest/getStarted.html 因为阿里云是禁止掉是STMP 2 ...

  9. 此页面上的脚本造成Web浏览器运行速度减慢。如果继续运行,您的计算机将可能停止响应。

    访问者所使用的浏览器不能完全支持页面里的脚本,形成“脚本错误”.遇到“脚本错误”时一般会弹出一个非常难看的脚本运行错误警告窗口,而事实上,脚本错误并不会影响网站浏览,因此这一警告可谓多此一举.要关闭警 ...

  10. Skipping unneeded JARs during scanning can improve startup time and JSP compilation time

    Tomcat在启动是提示: INFO [localhost-startStop-1] org.apache.jasper.servlet.TldScanner.scanJars At least on ...