页面样式覆盖的问题分析及优化

最近接到一个项目实例，需要在客户端内嵌入网站页面，首相想到的就是网站页面样式问题（是不是自适应，网站的访问限制等）。好那么最后得出的结论就是网站样式功能在客户端存在差异（客户端实现浏览网页方式是嵌入cef内核-Google）
1.样式覆盖
2.动态调整dom节点的宽高

$(document).ready(function(){
    //样式功能覆盖
});

好的那就先简单的实现功能的显示隐藏、样式的动态改变测试一下效果，结果没有预期的那么理想。页面的脚本存在异步的请求问题（页面的html存在异步加载），
这样我们没办法用ready、onload监听页面全部元素的加载，造成样式的覆盖失效。
那么接下来换一种思路 - setInterval clearInterval

  var t = setInterval(function(){
        if($('#...')){
            //样式功能覆盖
            clearInterval(t);
        }
    },200);

上述方式虽然可以监听页面部分异步加载元素的完成状态
这种轮循造成的开销很大、另外页面还是存在覆盖的时间间隔问题等（覆盖延迟）
正常的前端代码开发规范不允许有setTimeout、setInterval等（除非特殊情况）
好的换一种思路
从轮循监听页面的变化（是否有指定新生成的节点） 转变为 监听页面元素的更新

$(document).ready(function(){
    $(document.body).bind('DOMNodeInserted', function(e) {  
        var e = e.target || {};
        var classWord = e.className || "";
        if(classWord.indexOf("节点样式")!=-1){
            //样式功能覆盖
            $(document.body).unbind("DOMNodeInserted");
        }
    });  
});

注：本实例仅个人开发实践过程，如有不妥或更好建议请留言交流