微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
最近更新
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程
自媒体 新闻
首页 > web前端 > js教程 > 正文

通过 Dom 方法提高 innerHTML 性能_javascript技巧

php中文网
发布： 2016-05-16 19:05:39
原创
1084人浏览过
复制代码 代码如下:

function replaceHtml(el, html) {
    var oldEl = typeof el === "string" ? document.getElementById(el) : el;
    /*@cc_on // 原始的 innerHTML 在 IE 中的性能好一点
        oldEl.innerHTML = html;
        return oldEl;
    @*/
    var newEl = oldEl.cloneNode(false);
    newEl.innerHTML = html;
    oldEl.parentNode.replaceChild(newEl, oldEl);
    /* 一旦我们从 DOM 上移除老的元素，则返回新的元素引用。*/
    return newEl;
};

对于 Opera 也依然有性能提高，只是提高幅度没有上面两种浏览器惊人而已，
唯在 IE 中，则原始的 innerHTML 的方法更效率点。

大家都在看：

数码产品性能查询
数码产品性能查询

该软件包括了市面上所有手机CPU，手机跑分情况，电脑CPU，电脑产品信息等等，方便需要大家查阅数码产品最新情况，了解产品特性，能够进行对比选择最具性价比的商品。

下载
来源：php中文网
收藏 点赞
上一篇：Javascript的一种模块模式_YUI.Ext相关 下一篇：js用图作提交按钮或超连接_表单特效
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
最新问题
React createRef 深度解析：为何推荐使用而非自定义Ref对象？ React的createRef()API用于创建Refs，尽管其内部实现看似简单，仅返回一个带有current属性的普通对象，导致开发者疑惑为何不直接使用自定义对象。实际上，createRef提供了与React机制更佳的兼容性、代码可读性及未来可扩展性。它确保了Ref在Ref转发等高级场景中的一致性和健壮性，是React官方推荐的标准化Ref创建方式，而非简单的语法糖。
2025-11-23 11:35:30
620
掌握JavaScript模块化导入：在HTML中正确引入JS类 本文旨在解决在HTML文件中导入JavaScript类时遇到的常见问题，特别是关于ES模块的正确使用。我们将详细讲解如何通过type="module"属性以及在import语句中指定完整的文件扩展名来成功导入和使用JavaScript类，并提供清晰的代码示例和注意事项，确保开发者能够顺利实现模块化开发。
2025-11-23 11:28:02
668
在Go Web应用中通过AJAX发送下拉列表数据至服务器 本教程详细阐述了如何在Go语言开发的Web应用中，利用JavaScript和AJAX技术将HTML下拉列表的选中数据发送到服务器。通过客户端监听列表项点击事件，捕获选中值，并使用XMLHttpRequest发起POST请求，实现前后端的数据交互，为进一步的服务器端逻辑处理奠定基础。
2025-11-23 11:08:51
266
解决Outlook插件中按钮事件重复触发的问题：构建配置与缓存管理 在Outlook插件开发中，按钮事件重复触发通常源于构建配置不当，导致脚本文件被重复加载。本文将深入探讨此问题的常见原因，特别是Webpack等打包工具可能引起的脚本冗余，并提供一套系统的解决方案，包括优化构建输出、清理Office缓存以及开发最佳实践，确保事件仅被正确注册和执行一次。
2025-11-23 11:08:02
920
使用纯JavaScript实现可持久化用户偏好的暗黑模式切换 本教程详细介绍了如何使用纯JavaScript实现一个暗黑模式切换功能。通过一个简单的切换按钮，用户可以轻松地在亮/暗模式之间切换，并且系统会利用localStorage记住用户的选择，确保在页面重新加载后依然保持用户偏好，无需依赖任何第三方库。
2025-11-23 11:04:35
710
深入理解JavaScript中立即调用类表达式（IICE）及其继承机制 本文深入探讨JavaScript中立即调用类表达式（ImmediatelyInvokedClassExpression,IICE）的执行机制，特别是当其涉及多层继承时。我们将通过一个嵌套的类表达式实例，详细解析其构造函数调用顺序、this上下文的绑定，以及实例属性的初始化时机，揭示常见的潜在陷阱并提供解决方案，帮助开发者更好地理解和运用复杂的类结构。
2025-11-23 10:52:08
630
JavaScript工程化_Tree Shaking原理 TreeShaking是一种基于ES6模块静态分析的构建优化技术，通过标记清除未使用的导出代码来减小打包体积。它依赖import/export语法，在Webpack、Rollup等工具中启用生产模式后自动生效，要求模块无副作用或在package.json中正确声明sideEffects，以确保未引用代码被安全移除。
2025-11-23 10:52:03
192
解决 Outlook Add-in 按钮重复触发事件的问题 本文旨在解决Outlook加载项中按钮点击事件重复触发的问题，其根本原因通常是Webpack配置不当导致同一事件监听器被重复加载，以及Office缓存未及时清理。教程将详细指导如何检查并优化Webpack配置，确保仅加载一次JavaScript逻辑，并强调清理Office缓存的重要性，以保证加载项行为的正确性和一致性。
2025-11-23 10:47:01
263
JavaScript设备方向_陀螺仪数据获取 通过监听deviceorientation事件获取alpha、beta、gamma三个角度值，可实现设备方向检测，需处理权限请求与兼容性问题，并应用于游戏、全景浏览等场景。
2025-11-23 10:08:02
513
JavaScript服务端开发_Node.js高并发架构设计 Node.js高并发依赖事件驱动与非阻塞I/O，需结合cluster模块、微服务架构、异步流程控制、缓存、限流及进程管理等系统性设计保障性能与稳定。
2025-11-23 10:07:02
670
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部