将代码从 jquery 转换为原型或 dojo答案

【问题标题】：convert code from jquery to prototype or dojo将代码从 jquery 转换为原型或 dojo
【发布时间】：2009-06-25 04:17:05
【问题描述】：

如果你不得不这样做......

function addRemoveItemNS() {
  var $newLi = $('<li class="special">special and new <button class="addone">I am new</button> <button class="removeme">remove me</button></li>');
$('#list9 li.special')
  .find('button.addone')
 .unbind('click.addit')
 .bind('click.addit', function() {
   $(this).parent().after($newLi);
   addRemoveItemNS();
  })
  .end()
  .find('button.removeme')
  .unbind('click.removeit')
  .bind('click.removeit', function() {
 $(this).parent().remove();
  });
}
$(document).ready(function() {
  addRemoveItemNS();
});

...用prototype或dojo代替jquery，你会怎么做？

【问题讨论】：

您可能需要编辑此内容 - 您的标题不以任何方式反映您问题的内容
我同意 a_m0d。编辑（更改标题）将帮助您获得好的答案。

标签： javascript jquery dojo prototypejs

【解决方案1】：

以下是使用 Dojo 主干代码（或发布后的 Dojo 1.4）的方法。主干代码添加了对 end() 的支持以更好地匹配您的原始代码。您可以通过将 dojo.query(inserted) 保存为变量并在两个单独的语句中调用 .query() 来获得相同的效果来解决此问题，然后您可以使用 Dojo 1.3。

function addRemoveItemNS() {
  var html = '<li class="special">special and new <button class="addone">I am new</button> <button class="removeme">remove me</button></li>';
  var inserted = dojo.place(html, "list9");
  dojo.query(inserted)
    .query('button.addone')
      .onclick(function(evt){
        addRemoveItemNS()
      })
    .end()
    .query('button.removeme')
      .onclick(function(evt){
        //Use normal DOM API for parentNode to get reference.
        dojo.destroy(evt.target.parentNode);
      });
}

dojo.addOnLoad(function(){
  //First create #list9 node? Missing from original code.
  dojo.place('<ul id="list9"></ul>', dojo.body());
  addRemoveItemNS();
});

关于代码的一些注释：

通过使用 HTML 字符串，然后 dojo.placing 它，就不需要调用“取消绑定”了。
Dojo 不支持自定义名称来绑定到 DOM 节点上的事件，仅支持标准 DOM 事件名称，如 onclick、onfocus 等。
默认情况下，Dojo 不会将被单击的 DOM 节点设置为单击处理程序中的“this”引用，因为 Dojo 支持将“this”参数作为其 onclick 函数的一部分。这就是为什么在删除按钮单击操作中使用 evt.target 的原因。

【讨论】：

【解决方案2】：

好吧，因为您的代码中没有事件……或 AJAX。

只是一个用词不当的愚蠢请求。

【讨论】：