代码之家 › 专栏 › 技术社区 › Tom

javascript onclick处理程序中的性能问题

cross-browser user-interface browser performance javascript

Tom · 技术社区 · 17 年前

我用java脚本编写了一个游戏,虽然它可以工作,但对多次点击的响应很慢。下面是我用来处理点击的代码的一个非常简化的版本,如果您没有等待足够长的时间,它仍然无法响应第二次点击2。这是我需要接受的东西,还是有更快的方法为下一次点击做好准备?

顺便说一句,我使用quirksmode重新编码竞赛中的AddEvent附加此函数。

var selected = false;
var z = null;
function handleClicks(evt) {
    evt = (evt)?evt:((window.event)?window.event:null);
    if (selected) {
        z.innerHTML = '<div class="rowbox a">a</div>';
        selected = false;
    } else {
        z.innerHTML = '<div class="rowbox selecteda">a</div>';
        selected = true;
    }
}

现场代码可以在 http://www.omega-link.com/index.php?content=testgame

4 回复 | 直到 17 年前

Mike Dinescu 17 年前

您可以尝试只更改类名,而不是向DOM中删除/添加div(innerHTML属性就是这样做的)。

比如:

var selected = false;
var z = null;

function handleClicks(evt) 
{
    var tmp;

    if(z == null)
       return;

    evt = (evt)?evt:((window.event)?window.event:null);
    tmp = z.firstChild;
    while((tmp != null) && (tmp.tagName != 'DIV'))
        tmp = tmp.firstChild;
    if(tmp != null)
    {
      if (selected) 
      {
        tmp.className = "rowbox a";
        selected = false;
      } else 
      {
        tmp.className = "rowbox selecteda";
        selected = true;
      }
    }
}

great_llama 17 年前

Daniel A. White 17 年前

我相信你的问题是改变了生活方式 innerHTML

steamer25 17 年前

是的,您可能希望将innerHTML的性能与document.createElement()进行比较,甚至:

el.style.display = 'block' // turn off display: none.

推荐文章

DiscreteTom · JavaScript structuredClone在Chrome/Edge中获得了“非法调用”,但在NodeJS中没有

2 年前

Ish Mahajan · WebTransport的浏览器兼容性

2 年前

Lixin Wei · 为什么WebRTC可以在未经我许可的情况下获取我的本地IPv6地址?

2 年前

Václav Procházka · 动态创建获取和解析脚本的顺序

2 年前

jani · 检查安装了哪些浏览器,然后在其桌面上创建快捷方式

2 年前

Italy Zia · 我收到一个“拒绝执行来自的脚本”http://localhost:3000/js/dashboard/dashboard.js',因为其MIME类型('text/plain')不可执行

2 年前

kakakali · 为什么appendChild()会丢失一些子项?

2 年前

Djaro · 人们在我的标签上按下shift,但在另一个标签上释放它。如何防止Ctrl+Shift+Tab破坏我的“Shift_pressed”变量?

2 年前

StuartN · 使用默认搜索引擎的HTML搜索链接

2 年前

Vindicated · 如何访问当前未连接到的URL的本地存储?

2 年前