无闪烁更新网页内容JS实现

 更新时间:2013年12月19日 16:28:40   作者:  
这篇文章主要介绍了无闪烁更新网页内容JS实现,有需要的朋友可以参考一下

todo list

无闪烁更新网页的课题比较大。

加载的html字符串(通过ajax获取的),如果还需要运行代码,那么肯定有问题。

希望用一个不显示的iframe来承载这个对象。这有点dirty work的感觉。

最终解决方案是

复制代码 代码如下:

var str2DOMElement = function(html) {
    var frame = document.createElement('iframe');
    frame.style.display = 'none';
    document.body.appendChild(frame);
    frame.contentDocument.open();
    frame.contentDocument.write(html);
    frame.contentDocument.close();
    var el = frame.contentDocument.body.firstChild;
    document.body.removeChild(frame);
    return el;
    }
    var markup = '<div><p>text here</p></div>';
    var el = str2DOMElement(markup);

相关文章

  • 微信小程序导入Vant报错VM292:1 thirdScriptError的解决方法

    微信小程序导入Vant报错VM292:1 thirdScriptError的解决方法

    这篇文章主要给大家介绍了关于微信小程序导入Vant报错VM292:1 thirdScriptError的解决方法,文中通过示例代码介绍的非常详细,对大家学习或者使用微信小程序具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-08-08
  • 微信小程序中的轮播图实现示例

    微信小程序中的轮播图实现示例

    打开一个小程序,我们会发现,一般构图排版都是图片banner - 快捷按钮 - 产品/文章列表等详细信息,底部导航一般是2~5个。这样的排版是比较美观的,那么为什么要这样设计,这些轮播图、快捷按钮等小程序组件都有什么用呢?接下来就带你详细了解下
    2022-12-12
  • js中符号转意问题示例探讨

    js中符号转意问题示例探讨

    符号转意,大家或许有所了解,知识在使用中或许不是那么的在意,其实这个问题很重要,下面为大家讲解下js符号转意问题相关知识,感兴趣的朋友可以参考下
    2013-08-08
  • JavaScript简单实现鼠标拖动选择功能

    JavaScript简单实现鼠标拖动选择功能

    本篇文章主要是对JavaScript简单实现鼠标拖动选择功能的示例代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-03-03
  • JavaScript是否可实现多线程  深入理解JavaScript定时机制

    JavaScript是否可实现多线程 深入理解JavaScript定时机制

    JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不少人都深有同感,
    2009-12-12
  • js获取json中key所对应的value值的简单方法

    js获取json中key所对应的value值的简单方法

    下面小编就为大家带来一篇js获取json中key所对应的value值的简单方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-03-03
  • Javascript的一种模块模式

    Javascript的一种模块模式

    全局变量是魔鬼。在YUI中,我们仅用两个全局变量:YAHOO和YAHOO_config。YUI的一切都是使用YAHOO对象级的成员或这个成员作用域内的变量。我们建议在你的应用程序也使用类似的规则。
    2010-09-09
  • 游戏人文件夹程序 ver 3.0

    游戏人文件夹程序 ver 3.0

    游戏人文件夹程序 ver 3.0...
    2006-07-07
  • 详解JS中异常与错误处理的正确方法

    详解JS中异常与错误处理的正确方法

    这篇文章主要和大家分享了一些JavaScript中异常与错误处理的正确方法,文中的示例代码讲解详细,具有一定的借鉴价值,感兴趣的小伙伴可以参考一下
    2023-04-04
  • Javascript 是你的高阶函数(高级应用)

    Javascript 是你的高阶函数(高级应用)

    这篇文章主要介绍了Javascript 是你的高阶函数 ,需要的朋友可以参考下
    2015-06-06

最新评论