【源码】判断微信浏览器显示div1非微信浏览器显示div2

要在微信浏览器中显示一个div(比如div1),而在非微信浏览器中显示另一个div(比如div2),你可以使用JavaScript结合CSS的display属性来实现这个效果。
html代码:

<div id="div1" class="browser-specific">这是微信浏览器中的内容</div>

<div id="div2" class="browser-specific" style="display: none;">这是非微信浏览器中的内容</div>

<script> // 这里的JavaScript代码将检查是否是微信浏览器,并据此显示或隐藏div </script>

js代码:

window.onload = function() {

var div1 = document.getElementById('div1');

var div2 = document.getElementById('div2');

function isWeixinBrowser() {

var ua = navigator.userAgent.toLowerCase();

if (/micromessenger/i.test(ua)) { return true; } return false; }

if (isWeixinBrowser()) {

div1.style.display = 'block'; // 显示div1

div2.style.display = 'none'; // 隐藏div2 }

else { div1.style.display = 'none'; // 隐藏div1

div2.style.display = 'block'; // 显示div2 }

};

同用css代码:

.browser-specific {

/* 这里可以添加一些通用的样式 */

}

div1和div2都默认被设置为display: none;(尽管div2在HTML中直接设置了样式,但你也可以在CSS中统一设置)。然后,当页面加载完成后,JavaScript会检查是否是微信浏览器,并据此设置div1和div2的display属性。

提示:本文最后更新时间为 2024-05-01 如文中内容素材有错误或者已经失效,请留言告知。
声明

⚠️免责声明:本站的资源均来自于用户投稿,作个人学习使用,其版权均归原作者所有。

⚠️侵权声明:如有侵权请来信:wenanjie#5186a.com 告知。

⚠️转载声明:若需转载,请保留原文链接并附出处,谢谢合作。

个人中心
今日签到