页面嵌入问题

场景：在多个原页面中嵌入新页面，新页面涉及html，css，js（与原页面引入的js少数不同）

1.使用iframe嵌入

优点：1、不会与原页面发生冲突，iframe引入的页面是独立的。

　　　2、引入方便，<iframe src="newUrl" ></iframe>。

          3、可直接写公共方法插入iframe，多个原页面直接调用公共方法。

缺点：1、对域名有所限制，存在跨域问题。

          2、即使同域名但嵌入页面中如有第三方域名下脚本时会报错：script error (*** 引入页面正常，但是在点击事件中用到第三方域名下脚本时会报此错。)     

          3、iframe有实背景，需写在遮罩中插入iframe，此时背景太实效果不太好。

关于第三方域名下脚本的引入
	原页面	嵌入页面	结果	后续
1.	引入	未引入	可点击	1.要从原页面获取需要用到的信息 2.嵌入页面事件响应至原页面（悬）
2.	引入	引入	会不断闪现
3.	未引入	未引入	不可能
4.	未引入	引入	script error	调用脚本报错

   

 2.在页面直接引入一个自己写的js文件，js文件中包括往页面中插入新页面的html片段，css，以及js事件

***注意点：1.不能是在原页面中写js方法插入新页面的js文件，否则会导致无法调用新页面js中的方法。（个人推测是因为页面先加载完，在页面中js的调用先开始，后插入js虽加载了，但调用时找不到）

优点：1.新页面逻辑直接在原页面执行，无域名等限制，事件响应及时。

缺点：1.多个原页面中嵌入新页面，需要每个原页面都写调用方法及引入js。

          2.注意点：*** html片段中的标签命名最好带前缀来增加标识，否则可能与原页面命名有冲突，css及js会有影响。

 

总结：综合考虑，第2种方法较好，主要解决的只是命名不会有冲突问题。