排行js代码（js百大榜单）[20240503更新]

今天给各位分享排行js代码的知识，其中也会对js百大榜单进行解释，如果能碰巧解决你现在面临的问题，别忘了关注本站，现在开始吧！

本文目录一览：

• 1、如何优化js代码？
• 2、问一段简短的JS代码,求注释?
• 3、高分求JS代码

如何优化js代码？

一、 让代码简洁：一些简略的表达方式也会产生很好的优化\x0d\x0aeg：x=x+1;在不影响功能的情况下可以简写为x++;\x0d\x0a二、 变量名方法名尽量在不影响语意的情况下简单。（可以选择首字母命名）\x0d\x0aeg：定义数组的长度可以取名为：ArrLen而不需要取为ArrayLength。\x0d\x0a三、 关于JS的循环，循环是一种常用的流程控制。\x0d\x0aJS提供了三种循环：for(;;)、while()、for(in)。在这三种循环中for(in)的效率最差，因为它需要查询Hash键，因此应尽量少用for(in)循环，for(;;)、while()循环的性能基本持平。当然，推荐使用for循环，如果循环变量递增或递减，不要单独对循环变量赋值，而应该使用嵌套的++或_运算符。\x0d\x0a四、 如果需要遍历数组，应该先缓存数组长度，将数组长度放入局部变量中，避免多次查询数组长度。\x0d\x0a因为我们常常要根据字符串、数组的长度进行循环，而通常这个长度是不变的，比如每次查询a.length，就要额外进行一个操作，而预先把var len=a.length，则就少了一次查询。\x0d\x0a五、 尽量选用局部变量而不是全局变量。\x0d\x0a局部变量的访问速度要比全局变量的访问速度更快，因为全局变量其实是window对象的成员，而局部变量是放在函数的栈里的。\x0d\x0a六、 尽量少使用eval。\x0d\x0a每次使用eval需要消耗大量时间，这时候使用JS所支持的闭包可以实现函数模板。\x0d\x0a七、 减少对象查找\x0d\x0a因为JavaScript的解释性，所以a.b.c.d.e，需要进行至少4次查询操作，先检查a再检查a中的b，再检查b中的c，如此往下。所以如果这样的表达式重复出现，只要可能，应该尽量少出现这样的表达式，可以利用局部变量，把它放入一个临时的地方进行查询。\x0d\x0a八、 字符串连接。\x0d\x0a如果是追加字符串，最好使用s+=anotherStr操作，而不是要使用s=s+anotherStr。\x0d\x0a如果要连接多个字符串，应该少使用+=，如s+=a;s+=b;s+=c;应该写成s+=a + b + c；\x0d\x0a而如果是收集字符串，比如多次对同一个字符串进行+=操作的话，最好使用一个缓存。怎么用呢？使用JavaScript数组来收集，最后使用join方法连接起来，如下\x0d\x0avar buf = new Array();for(var i = 0; i String() .toString() new String() \x0d\x0a尽量使用编译时就能使用的内部操作要比运行时使用的用户操作要快。\x0d\x0aString()属于内部函数，所以速度很快，而.toString()要查询原型中的函数，所以速度逊色一些，new String()用于返回一个精确的副本。\x0d\x0a2. 浮点数转换成整型，这个更容易出错，很多人喜欢使用parseInt()，其实parseInt()是用于将字符串转换成数字，而不是浮点数和整型之间的转换，我们应该使用Math.floor()或者Math.round()。Math是内部对象，所以Math.floor()其实并没有多少查询方法和调用的时间，速度是最快的。\x0d\x0a3. 对于自定义的对象，如果定义了toString()方法来进行类型转换的话，推荐显式调用toString()，因为内部的操作在尝试所有可能性之后，会尝试对象的toString()方法尝试能否转化为String，所以直接调用这个方法效率会更高\x0d\x0a十、 尽量作用JSON格式来创建对象，而不是var obj=new Object()方法。\x0d\x0a因为前者是直接复制，而后者需要调用构造器，因而前者的性能更好。\x0d\x0a十一、 当需要使用数组时，也尽量使用JSON格式的语法，\x0d\x0a使用JSON格式的语法即直接使用如下语法定义数组：[parrm,param,param...],而不是采用new Array(parrm,param,param...)这种语法。因为使用JSON格式的语法是引擎直接解释的。而后者则需要调用Array的构造器。\x0d\x0a十二、 对字符串进行循环操作，例如替换、查找，就使用正则表达式。\x0d\x0a因为JS的循环速度比较慢，而正则表达式的操作是用C写成的API，性能比较好。\x0d\x0a十三、 插入HTML\x0d\x0a很多人喜欢在JavaScript中使用document.write来给页面生成内容。事实上这样的效率较低，如果需要直接插入HTML，可以找一个容器元素，比如指定一个div或者span，并设置他们的innerHTML来将自己的HTML代码插入到页面中。\x0d\x0a十四、 对象查询\x0d\x0a使用[“”]查询要比.items()更快\x0d\x0a十五、 定时器\x0d\x0a如果针对的是不断运行的代码，不应该使用setTimeout，而应该是用setInterval。setTimeout每次要重新设置一个定时器。\x0d\x0a十六、 尽量减少DOM调用\x0d\x0a在Web开发中，JavaScript的一个很重要的作用就是对DOM进行操作。可是对DOM的操作是非常昂贵的，因为这会导致浏览器执行回流 （reflow）操作。我们应该尽可能的减少DOM操作。

问一段简短的JS代码,求注释?

这是用了三个层来做一个字幕的流动效果：

demo2.innerHTML=demo1.innerHTML//是把demo2复制到demo1中,这样是为了让第一个层到底的时候有另一个层从头开始显示。

Marquee方法对层滚动是否到尽到进入判断，到头了就重头开始滚动。

demo.scrollLeft指的是滚动的距离，demo1.offsetWidth取的是demo1的宽度，offsetWidth比width要更精确

x-=1 就是x=x-1；

高分求JS代码

下面是一个提示信息窗口层代码!能实现关闭和拖动功能!你自己研究一下吧!

function dialog(){

var titile = '';

var width = 300;

var height = 180;

var src = "";

var path = "images/dialog/";

var sFunc = 'input id="dialogOk" type="button" style="{width:62px;height:22px;border:0;background:url(\'images/dialog/smb_btn_bg.gif\');line-height:20px;" value="确认" onclick="new dialog().reset();" / input id="dialogCancel" type="button" style="{width:62px;height:22px;border:0;background:url(\'images/dialog/smb_btn_bg.gif\');line-height:20px;" value="取消" onclick="new dialog().reset();" /';

var sClose = 'input type="image" id="dialogBoxClose" onclick="new dialog().reset();" src="' + path + 'dialogCloseF.gif" border="0" width="17" height="17" onmouseover="this.src=\'' + path + 'dialogClose0.gif\';" onmouseout="this.src=\'' + path + 'dialogCloseF.gif\';" align="absmiddle" /';

var sBody = '\

table id="dialogBodyBox" border="0" align="center" cellpadding="0" cellspacing="0"\

tr height="10"td colspan="4"/td/tr\

tr\

td width="10"/td\

td width="80" align="center" valign="absmiddle"img id="dialogBoxFace" src="' + path + '3.gif" //td\

td id="dialogMsg" style="font-size:12px;"/td\

td width="10"/td\

/tr\

tr height="10"td colspan="4" align="center"/td/tr\

trtd id="dialogFunc" colspan="4" align="center"' + sFunc + '/td/tr\

tr height="10"td colspan="4" align="center"/td/tr\

/table\

';

var sBox = '\

table id="dialogBox" width="' + width + '" border="0" cellpadding="0" cellspacing="0" style="border:1px solid #000;display:none;z-index:10;"\

tr height="1" bgcolor="#D6E3EB"td/td/tr\

tr height="25" bgcolor="FFCC00"\

td\

table onselectstart="return false;" style="-moz-user-select:none;" width="100%" border="0" cellpadding="0" cellspacing="0"\

tr\

td width="6"/td\

td id="dialogBoxTitle" onmousedown="new dialog().moveStart(event, \'dialogBox\')" style="color:#fff;cursor:move;font-size:12px;font-weight:bold;" /td\

td id="dialogClose" width="27" align="right" valign="middle"\

' + sClose + '\

/td\

td width="6"/td\

/tr\

/table\

/td\

/tr\

tr height="2" bgcolor="#EDEDED"td/td/tr\

tr id="dialogHeight" style="height:' + height + '"\

td id="dialogBody" bgcolor="#ffffff"' + sBody + '/td\

/tr\

/table\

div id="dialogBoxShadow" style="display:none;z-index:9;"/div\

';

var sBG = '\

div id="dialogBoxBG" style="position:absolute;top:0px;left:0px;width:100%;height:100%;background:url(images/dialog/blank.gif);"/div\

';

function $(_sId){return document.getElementById(_sId)}

this.show = function(){

this.middle('dialogBox');

this.shadow();

//$("dialogBoxBG").style.width = document.body.scrollWidth;

//$("dialogBoxBG").style.height = document.body.scrollHeight;

}

this.reset = function(){$('dialogBox').style.display='none';$('dialogBoxBG').style.display='none';$('dialogBoxShadow').style.display = "none";$('dialogBody').innerHTML = sBody;}

this.html = function(_sHtml){$("dialogBody").innerHTML = _sHtml;this.show();}

this.init = function(){

$('dialogCase') ? $('dialogCase').parentNode.removeChild($('dialogCase')) : function(){};

var oDiv = document.createElement('span');

oDiv.id = "dialogCase";

oDiv.innerHTML = sBG + sBox;

document.body.appendChild(oDiv);

$('dialogBoxBG').style.height = document.body.scrollHeight;

}

this.button = function(_sId, _sFuc){

if($(_sId)){

$(_sId).style.display = '';

if($(_sId).addEventListener){

if($(_sId).act){$(_sId).removeEventListener('click', function(){eval($(_sId).act)}, false);}

$(_sId).act = _sFuc;

$(_sId).addEventListener('click', function(){eval(_sFuc)}, false);

}else{

if($(_sId).act){$(_sId).detachEvent('onclick', function(){eval($(_sId).act)});}

$(_sId).act = _sFuc;

$(_sId).attachEvent('onclick', function(){eval(_sFuc)});

}

}

}

this.shadow = function(){

var oShadow = $('dialogBoxShadow');

var oDialog = $('dialogBox');

oShadow['style']['position'] = "absolute";

oShadow['style']['background'] = "#000";

oShadow['style']['display'] = "";

oShadow['style']['opacity'] = "0.2";

oShadow['style']['filter'] = "alpha(opacity=20)";

oShadow['style']['top'] = oDialog.offsetTop + 6;

oShadow['style']['left'] = oDialog.offsetLeft + 6;

oShadow['style']['width'] = oDialog.offsetWidth;

oShadow['style']['height'] = oDialog.offsetHeight;

}

this.open = function(_sUrl, _sMode){

this.show();

if(!_sMode || _sMode == "no" || _sMode == "yes"){

$("dialogBody").innerHTML = "iframe width='100%' height='100%' src='" + _sUrl + "' frameborder='0' scrolling='" + _sMode + "'/iframe";

}

}

this.showWindow = function(_sUrl, _iWidth, _iHeight, _sMode, _sTitle){

var oWindow;

var sLeft = (screen.width) ? (screen.width - _iWidth)/2 : 0;

var iTop = -80 + (screen.height - _iHeight)/2;

iTop = iTop 0 ? iTop : (screen.height - _iHeight)/2;

var sTop = (screen.height) ? iTop : 0;

if(window.showModalDialog _sMode == "m"){

oWindow = window.showModalDialog(_sUrl,_sTitle,"dialogWidth:" + _iWidth + "px;dialogheight:" + _iHeight + "px");

} else {

oWindow = window.open(_sUrl, _sTitle, 'height=' + _iHeight + ', width=' + _iWidth + ', top=' + sTop + ', left=' + sLeft + ', toolbar=no, menubar=no, scrollbars=' + _sMode + ', resizable=no,location=no, status=no');

this.reset();

}

}

this.event = function(_sMsg, _sOk, _sCancel, _sClose){

$('dialogFunc').innerHTML = sFunc;

$('dialogClose').innerHTML = sClose;

$('dialogBodyBox') == null ? $('dialogBody').innerHTML = sBody : function(){};

$('dialogMsg') ? $('dialogMsg').innerHTML = _sMsg : function(){};

_sOk _sOk != "" ? this.button('dialogOk', _sOk)| $('dialogOk').focus() : $('dialogOk').style.display = 'none';

_sCancel _sCancel != "" ? this.button('dialogCancel', _sCancel) : $('dialogCancel').style.display = 'none';

//_sOk ? this.button('dialogOk', _sOk) : _sOk == "" ? function(){} : $('dialogCancel').style.display = 'none';

//_sCancel ? this.button('dialogCancel', _sCancel) : _sCancel == "" ? function(){} : $('dialogCancel').style.display = 'none';

_sClose ? this.button('dialogBoxClose', _sClose) : function(){};

this.show();

}

this.set = function(_oAttr, _sVal){

var oShadow = $('dialogBoxShadow');

var oDialog = $('dialogBox');

var oHeight = $('dialogHeight');

if(_sVal != ''){

switch(_oAttr){

case 'title':

$('dialogBoxTitle').innerHTML = _sVal;

title = _sVal;

break;

case 'width':

oDialog['style']['width'] = _sVal;

width = _sVal;

break;

case 'height':

oHeight['style']['height'] = _sVal;

height = _sVal;

break;

case 'src':

if(parseInt(_sVal) 0){

$('dialogBoxFace') ? $('dialogBoxFace').src = path + _sVal + '.gif' : function(){};

}else{

$('dialogBoxFace') ? $('dialogBoxFace').src = _sVal : function(){};

}

src = _sVal;

break;

}

}

this.middle('dialogBox');

oShadow['style']['top'] = oDialog.offsetTop + 6;

oShadow['style']['left'] = oDialog.offsetLeft + 6;

oShadow['style']['width'] = oDialog.offsetWidth;

oShadow['style']['height'] = oDialog.offsetHeight;

}

this.moveStart = function (event, _sId){

var oObj = $(_sId);

oObj.onmousemove = mousemove;

oObj.onmouseup = mouseup;

oObj.setCapture ? oObj.setCapture() : function(){};

oEvent = window.event ? window.event : event;

var dragData = {x : oEvent.clientX, y : oEvent.clientY};

var backData = {x : parseInt(oObj.style.top), y : parseInt(oObj.style.left)};

function mousemove(){

var oEvent = window.event ? window.event : event;

var iLeft = oEvent.clientX - dragData["x"] + parseInt(oObj.style.left);

var iTop = oEvent.clientY - dragData["y"] + parseInt(oObj.style.top);

oObj.style.left = iLeft;

oObj.style.top = iTop;

$('dialogBoxShadow').style.left = iLeft + 6;

$('dialogBoxShadow').style.top = iTop + 6;

dragData = {x: oEvent.clientX, y: oEvent.clientY};

}

function mouseup(){

var oEvent = window.event ? window.event : event;

oObj.onmousemove = null;

oObj.onmouseup = null;

if(oEvent.clientX 1 || oEvent.clientY 1 || oEvent.clientX document.body.clientWidth || oEvent.clientY document.body.clientHeight){

oObj.style.left = backData.y;

oObj.style.top = backData.x;

$('dialogBoxShadow').style.left = backData.y + 6;

$('dialogBoxShadow').style.top = backData.x + 6;

}

oObj.releaseCapture ? oObj.releaseCapture() : function(){};

}

}

this.hideModule = function(_sType, _sDisplay){

var aIframe = parent.document.getElementsByTagName("iframe");aIframe=0;

var aType = document.getElementsByTagName(_sType);

var iChildObj, iChildLen;

for (var i = 0; i aType.length; i++){

aType[i].style.display = _sDisplay;

}

for (var j = 0; j aIframe.length; j++){

iChildObj = document.frames ? document.frames[j] : aIframe[j].contentWindow;

iChildLen = iChildObj.document.body.getElementsByTagName(_sType).length;

for (var k = 0; k iChildLen; k++){

iChildObj.document.body.getElementsByTagName(_sType)[k].style.display = _sDisplay;

}

}

}

this.middle = function(_sId){

var sClientWidth = parent ? parent.document.body.clientWidth : document.body.clientWidth;

var sClientHeight = parent ? parent.document.body.clientHeight : document.body.clientHeight;

var sScrollTop = parent ? parent.document.body.scrollTop : document.body.scrollTop;

document.getElementById(_sId)['style']['display'] = '';

document.getElementById(_sId)['style']['position'] = "absolute";

document.getElementById(_sId)['style']['left'] = (document.body.clientWidth / 2) - (document.getElementById(_sId).offsetWidth / 2);

var sTop = -80 + (sClientHeight / 2 + sScrollTop) - (document.getElementById(_sId).offsetHeight / 2);

document.getElementById(_sId)['style']['top'] = sTop 0 ? sTop : (sClientHeight / 2 + sScrollTop) - (document.getElementById(_sId).offsetHeight / 2);

}

}

function _error_msg_show(msg, click, icon, title)

{

click = click ? click : ' ';

icon = icon ? icon : '';

title = title ? title : '系统提示信息';

switch (icon)

{

case 'forbid':

icon = 1;

break;

case 'succ':

icon = 2;

break;

case 'smile':

icon = 3;

break;

case 'forget':

icon = 4;

break;

case 'sorry':

icon = 5;

break;

case 'care':

icon = 6;

break;

case '':

icon = 5;

break;

}

dg=new dialog();

dg.init();

dg.set('src', icon);

dg.set('title', title);

dg.event(msg, click, '', click);

}

function _win_error_msg_show(msg, click, icon, top, left, width, height)

{

click = click ? click : ' ';

icon = icon ? icon : '';

title = '系统提示信息';

top = top ? top : 80;

switch (icon)

{

case 'forbid':

icon = 1;

break;

case 'succ':

icon = 2;

break;

case 'smile':

icon = 3;

break;

case 'forget':

icon = 4;

break;

case 'sorry':

icon = 5;

break;

case 'care':

icon = 6;

break;

case '':

icon = 5;

break;

}

dg=new dialog();

dg.init();

dg.set('src', icon);

dg.set('title', title);

if (width)

{

dg.set('width', width);

}

if (height)

{

dg.set('height', height);

}

dg.event(msg, click, '', click);

if (left)

{

document.getElementById('dialogBox')['style']['left'] = left;

document.getElementById('dialogBoxShadow')['style']['left'] = left;

}

if (top)

{

document.getElementById('dialogBox')['style']['top'] = top;

document.getElementById('dialogBoxShadow')['style']['top'] = top;

}

}

function _confirm_msg_show(msg, click_ok, click_no, title)

{

click_ok = click_ok ? click_ok : ' ';

click_no = click_no ? click_no : ' ';

title = title ? title : '系统提示信息';

dg=new dialog();

dg.init();

dg.set('src', 3); // smile

dg.set('title', title);

dg.event(msg, click_ok, click_no, click_no);

}

function _win_confirm_msg_show(msg, click_ok, click_no, top, left, width, height)

{

click_ok = click_ok ? click_ok : ' ';

click_no = click_no ? click_no : ' ';

title = '系统提示信息';

top = top ? top : 80;

dg=new dialog();

dg.init();

dg.set('src', 3); // smile

dg.set('title', title);

if (width)

{

dg.set('width', width);

}

if (height)

{

dg.set('height', height);

}

dg.event(msg, click_ok, click_no, click_no);

if (left)

{

document.getElementById('dialogBox')['style']['left'] = left;

document.getElementById('dialogBoxShadow')['style']['left'] = left;

}

if (top)

{

document.getElementById('dialogBox')['style']['top'] = top;

document.getElementById('dialogBoxShadow')['style']['top'] = top;

}

}

排行js代码的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于js百大榜单、排行js代码的信息别忘了在本站进行查找喔。