隨著html5網頁技術的日益發展，越來越多的網站都喜歡做成PC和WAP同源碼的響應式模板，這樣的模板有非常大的優勢，代碼不緊湊無需多終端多代碼，同一段代碼可以適應全部終端，但是同時也帶來了一些小的問題，例如如果想投放一段廣告，該廣告只想在PC端顯示而WAP端不顯示，或者只想WAP端顯示PC端不顯示該如何處理呢？前面361模板給大家介紹過CSS的一個這樣的應用《如何用CSS實現PC端顯示 手機端隱藏代碼效果》，今天361模板給大家帶來JS實現響應式模板廣告布局 電腦和手機訪問顯示不同廣告內容代碼。

代碼如下：

<script>var url = location.search;url = url.substr(1);var bs={versions:function(){var u = navigator.userAgent, app = navigator.appVersion;return {trident: u.indexOf('Trident') > -1, presto: u.indexOf('Presto') > -1,webKit: u.indexOf('AppleWebKit') > -1, gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/), ios: !!u.match(//(i[^;]+;( U;)? CPU.+Mac OS X/), android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, iPhone: u.indexOf('iPhone') > -1,iPad: u.indexOf('iPad') > -1         };}(),language:(navigator.browserLanguage || navigator.language).toLowerCase()} var flag = true;if(bs.versions.mobile && url!='mobile'){if(bs.versions.android||bs.versions.iPhone||bs.versions.iPad||bs.versions.ios){flag=false;}}if(flag){/*pc廣告代碼*/document.writeln("<script src=/"//js//1.js/"><//script>");}else{/*移動廣告代碼*/document.writeln("<script language=JavaScript src=/"//222.js/"><//script>");}</script>

上面的代碼我們首先把PC廣告代碼放到1.js里，移動端廣告代碼放到222.js中，這樣就可以實現不同終端出現不同的廣告了。