我有一个函数，它进行ajax调用，然后返回一个插入表td元素的html。使用element.innerHTML=ajaxResult;现在，我想访问ajaxResult中name属性为special的元素。所以我做document.getElementsByName('special')并希望得到4-5个元素。但实际上我没有。
这使我无法访问这些元素而且我被卡住了。请帮我解决这个问题。在此先感谢！
我认为这与我设置dom后innerHTML没有重新加载有关。但不知道如何重新加载它。
我在IE8兼容性视图和IE7标准中使用IE8 :(
修改
这是我的功能
function handleStateChange()
{
if(ajaxRequest.readyState==4 && ajaxRequest.status==200) {
var responseStr = ajaxRequest.responseText;
var splitResult = responseStr.split("$$$$$$$$$$$$$$$$$$$$");
var leftHtml= splitResult [0];
var rightHtml= splitResult [1];
document.getElementById("div1").innerHTML=leftHtml;
if(rightHtml !="") {
document.getElementById("div2").innerHTML=rightHtml;
}
if(splitResult.length >=3 ){
var appActionflag = splitResult [2];
document.getElementById("userAction").innerHTML=appActionflag;
}
if(splitResult.length >= 4 ){
var userId = splitResult [3];
document.getElementById("userId").innerHTML=userId;
}
reverseDNASwitch();
var grpList = document.getElementsByName('parmGrpId');
alert('javascript is working! Found:'+grpList.length);
for(var i=0;i<grpList.length;i++){
alert('Got GroupId: '+ (i));
var grpTd = grpList[i];
grpTd.innnerHTML='Hi';
}
}
}
答案 0 :(得分：3)
如果您要添加的表格单元本身位于DOM中，则应该可以正常工作。 （所以我可能不得不删除这个答案;最初我认为 document.getElementsByName已被弃用，但我错了）。以下是使用getElementsByName的示例：
(function() {
// Get the target
var target = document.getElementById("target");
// Dynamically add content
target.innerHTML =
'<div name="special">special 1</div>' +
'<div name="special">special 2</div>' +
'<div name="special">special 3</div>';
// Get those elements
var list = document.getElementsByName("special");
// Prove we got them
var p = document.createElement('p');
p.innerHTML = "Found " + list.length + " 'special' elements";
document.body.appendChild(p);
})();
当然，因为它是 document的函数，它会找到{strong>所有元素name="special"，而不仅仅是name添加到表格单元格中。
如果不允许元素具有getElementsByName("special")属性，则上述操作不适用于IE。例如，如果你寻找<div name="special">。它会忽略<input name="special">但会找到name，因为div不是id元素的有效属性。 this MSDN article中的详细信息。更糟糕的是，IE将包含 name 匹配的元素，即使这当然与Element#querySelectorAll无关。 叹息
除非您需要支持IE7及更早版本（例如，除非您正在为中国开发），否则您可以将'[name="special"]'与选择器name一起使用。这只会在使用(function() {
// Get the target
var target = document.getElementById("target");
// Dynamically add content
target.innerHTML =
'<div name="special">special 1</div>' +
'<div name="special">special 2</div>' +
'<div name="special">special 3</div>';
// Get those elements
var list = target.querySelectorAll('[name="special"]');
// Prove we got them
var p = document.createElement('p');
p.innerHTML = "Found " + list.length + " 'special' elements";
document.body.appendChild(p);
})();
属性的元素的元素中查找。
示例：Live Copy | Live Source
querySelectorAll如果您需要支持IE7或更早版本，可以查看this other Stack Overflow question and my answer to it。问题指向this article关于将document添加到<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<div id="target"></div>
<script>
(function() {
// IE7 support for querySelectorAll. Supports multiple / grouped selectors and the attribute selector with a "for" attribute. http://www.codecouch.com/
if (!document.querySelectorAll) {
(function(d, s) {
d=document, s=d.createStyleSheet();
d.querySelectorAll = function(r, c, i, j, a) {
a=d.all, c=[], r = r.replace(/\[for\b/gi, '[htmlFor').split(',');
for (i=r.length; i--;) {
s.addRule(r[i], 'k:v');
for (j=a.length; j--;) a[j].currentStyle.k && c.push(a[j]);
s.removeRule(0);
}
return c;
}
})();
}
var qsaWorker = (function() {
var idAllocator = 10000;
function qsaWorkerShim(element, selector) {
var needsID = element.id === "";
if (needsID) {
++idAllocator;
element.id = "__qsa" + idAllocator;
}
try {
return document.querySelectorAll("#" + element.id + " " + selector);
}
finally {
if (needsID) {
element.id = "";
}
}
}
function qsaWorkerWrap(element, selector) {
return element.querySelectorAll(selector);
}
// Return the one this browser wants to use
return document.createElement('div').querySelectorAll ? qsaWorkerWrap : qsaWorkerShim;
})();
// Get the target
var target = document.getElementById("target");
// Dynamically add content
target.innerHTML =
'<div name="special">special 1</div>' +
'<div name="special">special 2</div>' +
'<div name="special">special 3</div>';
// Get those elements
var list = qsaWorker(target, '[name="special"]');
// Prove we got them
var p = document.createElement('p');
p.innerHTML = "Found " + list.length + " 'special' elements";
document.body.appendChild(p);
})();
</script>
</body>
</html>
，我对该问题的回答讨论了如何在元素特定级别模拟该问题。
因此，将该文章中的代码与我对其他问题和上述示例的回答结合起来，我们得到：
{{1}}
适用于IE7。
答案 1 :(得分：1)
作为特定场景的选项，您希望获取具有特定属性（和值）的元素，您可以使用如下函数：
function getElementsByAttribute(options) {
/*if (container.querySelectorAll) {
var selector = '';
if (options.tagFilter) {
selector += options.tagFilter;
}
selector += '[' + options.attr;
if (options.val) {
selector += '="' + options.val.replace(/"/g, '\\"') + '"';
}
selector += ']';
return Array.prototype.slice.call(options.container.querySelectorAll(selector));
}*/
var elements = options.container.getElementsByTagName(options.tagFilter || "*"),
ret = [],
i, cur,
matches = (function () {
if (options.val) {
return function (el) {
return el.getAttribute(options.attr) === options.val;
};
} else {
return function (el) {
return el.hasAttribute(options.attr);
};
}
})();
for (i = 0; i < elements.length; i++) {
cur = elements[i];
if (matches(cur)) {
ret.push(cur);
}
}
return ret;
}
你称之为：
window.onload = function () {
var contain = document.getElementById("container"),
els = getElementsByAttribute({
container: contain,
attr: "name",
val: "special",
tagFilter: ""
});
console.log("els", els);
};
DEMO： http://jsfiddle.net/cxq6t/1/
（我保留了我支持querySelectorAll的原始逻辑，但根据评论，证明不能在具有无效属性的旧IE中工作）
传递给函数的对象接受：
container：包含要查看的元素attr：要查找的属性val：与tagFilter：匹配元素的tagName的可选过滤器我在IE7 / 8中进行了测试，看看<div name="special">是否匹配，确实如此。和其他<input />一样。
如果你想将选择器扩展为像querySelectorAll支持的更复杂的东西，你可以使用像T.J.Crowder这样的polyfill。但这似乎完成了工作。