我有一个函数，它进行ajax调用，然后返回一段插入到表的td中的html。元素。使用element.innerHTML=ajaxResult;现在我想访问 ajaxResult 中的元素有 name属性为special 。所以我做了一个document.getElementsByName('special')并期望获得 4-5 个元素。但实际上我什么也没得到。
这使我无法访问这些元素，并且陷入困境。请帮我解决这个问题。提前致谢!
我认为这与 dom 有关设置innerHTML后不重新加载。但不知道如何重新加载它。
我在 IE8 兼容性 View 和 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';
}
}
}
最佳答案
如果您要添加的表格单元格本身位于 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 的函数，这将找到所有 name="special" 的元素，而不仅仅是您添加到表格单元格的内容。
如果元素不允许具有 name，则上述内容在 IE 上不起作用属性。例如，如果您查找 getElementsByName("special") 。它会忽略 <div name="special">但找到<input name="special"> ，因为name不是 div 的有效属性元素。详情见this MSDN article 。更糟糕的是，IE 将包含 id 的元素。 匹配，尽管这当然与 name 无关。 叹息
除非您需要支持 IE7 及更早版本(例如，除非您为中国开发)，否则可以使用 Element#querySelectorAll使用选择器'[name="special"]' 。这只会在元素内查找使用该 name 的元素。属性。
示例:Live Copy | Live Source
(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);
})();
如果您需要支持 IE7 或更早版本，您可以查看 this other Stack Overflow question and my answer to it 。问题指向this article关于添加querySelectorAll至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>
适用于 IE7。
关于javascript - 访问通过设置innerHTML创建的HTML元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16588639/