Javascript ajax响应上的Dojo-Dojo.byId（）

我正在使用Dojo对Ajax的支持

function handleSubmit(evt, targetUrl, submitForm, updateDiv) {
            dojo.stopEvent(evt);
            dojo.xhrPost( {
                url: targetUrl,
                handleAs: "text",
                load: function(response){
                    updateDiv.innerHTML = response;
                    wireEvents();
                    return response;
                    },
                form: submitForm,
                error: function(response, ioArgs) { 
                    console.error("HTTP status code: ", ioArgs.xhr.status); 
                    return response; 
                }               
            });
        }

来自服务器的响应包含的数据比我需要的多。 我想用这个来代替

load: function(response){
  updateDiv.innerHTML = response;
  wireEvents();
  return response;
},

变成

   load: function(response){
      updateDiv.innerHTML = dojo.byId('elemToExtract', response);
      wireEvents();
      return response;
    },

我必须用ajax响应的一部分更新我的页面。我需要能够在响应上使用dojo.byId选择器（使用响应作为上下文根或类似于我在jQuery中找到的东西）

你知道我怎样才能做到这一点吗

---

谢谢

您收到的响应是纯文本，由ajax调用的handleAs参数定义。如果要使用dojo.byId查询此响应中包含的标记，则需要将其转换为解析的HTML，并为其创建DOM。为此，您可以使用响应创建一个临时html元素；然后可以使用dojo.byId提取所需的部件

load: function(response){
    var tempDiv = dojo.create('div', {innerHTML: response});
    updateDiv.innerHTML = dojo.byId('elemToExtract', tempDiv);
    wireEvents();
    return response;
},

编辑：

上面包含错误，因为dojo.byId需要一个文档作为第二个参数，并且它不接受节点（另请参见）；此外，它还返回一个无法分配给innerHTML的节点实例。在工作解决方案中，当您拥有临时元素时，您需要使用dojo.query提取所需的零件。然后可以使用dojo.place将其粘贴到真实页面的DOM中。请注意，如果要替换以前的内容，则需要先用dojo.empty删除目标节点的所有子节点，然后再使用dojo.place

load: function(response){
    var tempDiv = dojo.create('div', {innerHTML: response});
    var results = dojo.query('[id=elemToExtract]', tempDiv);
    if (results.length) {
        dojo.empty(updateDiv);
        dojo.place(results[0], updateDiv);
        wireEvents();
    }
    return response;
},

请注意，dojo.place和dojo.create函数分别添加到版本1.2和1.3中；如果您有以前的版本，可以使用DOM api替换它：

load: function(response){
    var tempDiv = document.createElement('div');
    tempDiv.innerHTML = response;
    var results = dojo.query('[id=elemToExtract]', tempDiv);
    if (results.length) {
        dojo.empty(updateDiv);
        updateDiv.appendChild(result[0]);
        wireEvents();
    }
    return response;
},

---

问题是，

dojo.byId

需要一个文档作为第二个参数。另一个问题是，直到元素被放入DOM中，ID才“已知”。（我可能在最后一点上错了，或者它可能取决于浏览器。在我执行的实验中，dojo.byId在HTML进入DOM之前没有返回任何内容。）

这就是说，您可以通过将ajax调用返回的数据放在一个隐藏元素中，然后在其上使用

dojo.query

来实现所需的功能

假设您的HTML中有以下内容：

然后，您的xhrGet如下所示：

dojo.xhrGet( { 
    url: 'http://jsbin.com/erawu',
    handleAs: 'text',
    load: function(data) {
       var storage = dojo.byId('storage');
       storage.innerHTML = data;
       var want = dojo.query('#iwant', storage )[0];  // or dojo.query(...).forEach(...)
       if (want) {
          dojo.byId('hello').innerHTML = want.innerHTML;
          // depending on what you want
          // you could also use dojo.place( want, dojo.byId('hello'), 'first')
       }
    },
    error: function() {
        console.log( arguments );
        console.error('ONOES!');
    }
});

---

下面是一个使用dojo 1.2的示例。

Max&seth。。非常感谢

最后，解决方案基于马西米利亚诺的建议

我将其改编为Dojo1.2.3（因为这个版本也缺少dojo.empty（）函数）。需要调用“results[0].innerHTML”才能从dojo变量中提取dom。然后，在不调用empty（）的情况下，我可以直接替换目标“updateDiv”的innerHTML

这里的关键点是dojo.query（）能够查询作为上下文传递domNode的树（对不起，我是dojo新手）

我不知道为什么，但是检查“if（results.length）{”在运行时出现了问题。如果我调试JS，我认为我添加了一些延迟，并且工作正常。问题是在运行时，似乎条件被评估为false…我不确定为什么

---

再次感谢

我正在查看api文档。似乎此函数在dojo 1.3.2中使用。我现在使用的是1.2.x。我将查看是否可以在此版本中找到相关函数。对不起，我使用的是1.3版本，我没有注意到以前的版本中没有提供create。无论如何，您可以使用l应用相同的技术低级DOM api：使用document.createElement（'div'）创建元素并手动设置innerHTML属性，那么您应该能够使用dojo.byId。重点是使用DOM将纯文本转换为html。我认为dojo.create不仅仅是创建一个包含内容的元素。如果您能够将其结果作为byId的第二个元素传递，dojo.create应该创建一个dojo.byId的文档（'elemToExtract'，tempDiv）能够解析。api说它必须是一个文档。我可以用一个包含内容（innerHTML）的div元素创建tempDocument=响应。问题是我添加的元素将只包含文本，并且没有dojo.byId可解析的结构。此解决方案不起作用，因为dojo.byId的第二个参数必须是文档，而不是节点（这是dojo.create返回的）。我承认我没有测试解决方案，因此我没有看到错误。我详细阐述了一个与Seth几乎相同的解决方案，唯一的例外是我的解决方案没有使用隐藏元素。我认为这可能很有趣，所以我将其作为我答案的编辑发布。我希望这不会被视为滥用。我也注意到使用id进行查询在您将元素放入页面的实际DOM之前，ector将失败。但是您可以使用属性选择器测试id。希望您觉得它有用。

load: function(response){
      var tempDiv = document.createElement("div");
      tempDiv.innerHTML = response;
      var results = dojo.query("[id=elemToExtract]", tempDiv);
      updateDiv.innerHTML = results[0].innerHTML;
      wireEvents();
      return response;
 },