参考自：http://blog.csdn.net/xuexiaodong009/article/details/51810252

其实在web开发中，单纯因为js导致性能问题的很少，主要都是因为DOM操作引起的。

这些dom的操作优化大概包括以下：

1查找元素的优化

2改变DOM，包括添加，修改，删除DOM

3改变DOM的样式类等

4批量修改DOM

5减少iframe

6样式放在header中，脚本放在关闭标签</body>之前

前端dom元素的操作优化建议的更多相关文章

  1. JQuery处理DOM元素-属性操作

    JQuery处理DOM元素-属性操作 //操作元素的属性: $('*').each(function(n){ this.id = this.tagName + n; }) //获取属性值: $('') ...

  2. Ajax基础（四）--dom元素简单操作

    1 //js对dom元素的操作 //添加dom元素 var param = document.createElement("p"); var node = document.cre ...

  3. JS DOM元素的操作（创建，添加，删除，和修改属性）

    1.1 创建 DOM 元素以及相应的追加方式 1.1.1  创建:document.createElement('div'); 添加: fatherEle.appendChild(ele); appe ...

  4. JS中对DOM元素的操作

    https://www.runoob.com/jquery/jquery-ref-html.html 1.each  遍历 //遍历所有class为checksingle的DOM元素 $(" ...

  5. Dom元素的操作

    getElementById(): 获取有指定惟一ID属性值文档中的元素 getElementsByName(name): 返回的是数组 getElementsByTagName(): 返回具有指定标 ...

  6. 返本求源——DOM元素的特性与属性

    抛砖引玉 很多前端类库(比如dojo与JQuery)在涉及dom操作时都会见到两个模块:attr.prop.某天代码复查时,见到一段为某节点设置文本的代码: attr.set(node, 'inner ...

  7. JavaScript-dom3 json_str dom元素控制 模拟百度搜索

    访问关系-封装代码 html <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...

  8. vue（4）—— vue的过滤器，监听属性，生命周期函数，获取DOM元素

    过滤器 vue允许自定义过滤器,我个人认为,过滤器有两种,一种是对数据的清洗过滤,一种是对数据切换的动画过滤 数据切换的动画过滤 这里还是利用前面的动态组件的例子: 这里由于没办法展示动画效果,代码如 ...

  9. react项目中对dom元素样式修改的另一种方法以及将组件插入到node节点中

    在项目中,以前如果遇到对dom元素的操作都是直接获取dom元素,比如说: 但是如果修改的样式比较多的话,不如直接"切换"dom元素,如下例子: 这样会节省一些性能.因为操作dom的 ...

随机推荐

  1. gogogo

  2. openstack-ocata-仪表盘服务6

    Dashboard(horizon)是一个web接口,使得云平台管理员以及用户可以管理不同的Openstack资源以及服务.这个部署示例使用的是 Apache Web 服务器.一. 安装和配置 接下来 ...

  3. android判断网络是否可用

    private boolean isNetworkConnected(Context context) { ConnectivityMannger cManager = (ConnectivityMa ...

  4. 在 React 中使用 JSX 的好处

    优点: 1.允许使用熟悉的语法来定义 HTML 元素树: 2.提供更加语义化且移动的标签: 3.程序结构更容易被直观化: 4.抽象了 React Element 的创建过程: 5.可以随时掌控 HTM ...

  5. Linux下搭建SVN服务器遇到的问题及解决方法，

    1.checkout时,提示:URL svn://192.168.1.99/svntest doesn't exist... 奇怪,怎么会提示库不存在呢?肯定是哪里配置问题.后来尝试了半天,也在网上搜 ...

  6. MyEclipse无法部署项目

    1 错误描述 2 错误原因 3 解决办法

  7. ASP.NET Core MVC中构建Web API

    在ASP.NET CORE MVC中,Web API是其中一个功能子集,可以直接使用MVC的特性及路由等功能. 在成功构建 ASP.NET CORE MVC项目之后,选中解决方案,先填加一个API的文 ...

  8. shiro的登陆认证（shiro项目中来的一）

    一,图解 二,流程 2.1,创建token令牌,token中有用户提交的认证信息即账号和密码 Subject subject = SecurityUtils.getSubject(); Usernam ...

  9. 手机端仿ios的日期组件脚本一

    二,代码 <script> var calendar1 = new LCalendar(); calendar1.init({ 'trigger': '#startDate', //标签i ...

  10. python基础—装饰器

    python基础-装饰器 定义:一个函数,可以接受一个函数作为参数,对该函数进行一些包装,不改变函数的本身. def foo(): return 123 a=foo(); b=foo; print(a ...