跨浏览器(IE/FF/OPERA)JS代码小结
判断 IE ,Opera浏览器的类型,针对不同浏览器下多单元 元素事件或者样式的控制,比如td li等的控制。
<script language="javascript" type="text/javascript" >
var Fs_IsIE5 = (navigator.userAgent.indexOf("IE 5") > -1) || (navigator.userAgent.indexOf("IE 6") > -1);//导航的用户代理判断IE
var Fs_IsIE4 = document.all&&navigator.userAgent.indexOf("Opera")==-1//opera 判断
function InitColorPalette()
{
if (Fs_IsIE4)
{//Opera
var x = document.all.tags('td');
}
else
{//IE
var x = document.getElementsByTagName('td');
}
for (var i=4; i<x.length; i++)
{
x[i].onmouseover = over;
x[i].onmouseout = out;
x[i].onclick = click;
}
} ---------------------->相应的写js函数.
*************************************************************************************************
针对iframe的浏览器版本控制
<div>
<iframe class="" width="97%" height="280" scrolling="no" onunload="this.height=280;"
onload="iframeResize(); scrollToTop();" frameborder="0" id="mainFrame" name="mainFrame"
src="XXX.aspx">您的浏览器不支持此功能,请您使用最新的版本。</iframe>
</div>
<script type="text/javascript">
<!--
if (window.addEventListener){//FF
window.addEventListener("load", iframeResize, false);//默认为false,强类型防止侦听器被回收
alert('window.addEventListener');
}
else
{
if (window.attachEvent){//IE
window.attachEvent("onload", iframeResize);
alert('window.attachEvent');
}
else{ //other
window.onload=iframeResize
alert('other');
}
}
-->
</script>
//IE FF下控制iframe的高度
function iframeResize()
{
var dyniframe = null;
if (document.getElementById)
{
dyniframe = document.getElementById("mainFrame");
if (dyniframe)
{
if (dyniframe.contentDocument)
{//firefox
dyniframe.height = dyniframe.contentDocument.body.scrollHeight + 10;}
else if (dyniframe.document && dyniframe.document.body.scrollHeight)
{ //IE
iframeheight = mainFrame.document.body.scrollHeight + 10;
dyniframe.height = iframeheight;}
}
}
}
function scrollToTop()
{
document.body.scrollTop=0;
}
********************************************************************************************
//判断不同浏览器的addEventListener,attachEvent
<script language="javascript" type="text/javascript" >
function winOnload() {
var o = document.getElementById("btn");
/* o.onclick = btnClick;
o.onclick = btnClick1;
o.onclick = btnClick2;*/ //触发一个btnClick2
/* o.attachEvent('onclick', btnClick);
o.attachEvent('onclick', btnClick1);
o.attachEvent('onclick', btnClick2);*/ //IE下触发btnClick->btnClick1->btnClick2
o.addEventListener("click", btnClick, false);
o.addEventListener("click", btnClick1, false);
o.addEventListener("click", btnClick2, false); //FF下触发
}
function btnClick() {
alert("0000XXXX");
}
function btnClick1() {
alert("1111XXXX");
}
function btnClick2() {
alert("2222XXXX");
}
if (window.addEventListener) {
window.addEventListener('load', winOnload, false);
} else {
window.attachEvent('onload', winOnload);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="btn" >XXXXXXXXXXXXXX</div>
</form>
</body>
</html>
****************************************** 专注于.net ********************************************
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源!
· 周边上新:园子的第一款马克杯温暖上架