Question

我创建的HTML文档包含链接的专有标记，这些链接在通过我们的发布系统时会转换为标准HTML。例如：

<LinkTag contents="Link Text" answer_id="ID" title="Tooltip"></LinkTag>

当我创作和审阅这些文档时，我需要能够在发布之前在浏览器中测试这些链接。我编写了以下JavaScript来读取属性并将它们写入<a>标记：

var LinkCount = document.getElementsByTagName('LinkTag').length; 
for (i=0; i<LinkCount; i++) { 

var LinkText = document.getElementsByTagName('LinkTag')[i].getAttribute('contents');
var articleID = document.getElementsByTagName('LinkTag')[i].getAttribute('answer_id');
var articleTitle = document.getElementsByTagName('LinkTag')[i].getAttribute('title');

document.getElementsByTagName('LinkTag')[i].innerHTML = '<a href="publishing_system_url_id='+ articleID +' title="' + articleTitle + '">' + LinkText + '</a>';
}

这适用于Firefox，但不适用于IE。我已经阅读了关于IE的innerHTML问题并想象这里的问题，但我无法找到解决方法。我想也许jQuery可能是要走的路，但我并不精通它。

如果我能在IE中使用它，这将是一个巨大的生产力提升。任何想法都将不胜感激。

Answer 1

innerHTML仅适用于open / close标签的INSIDE。例如，如果您的LinkTag[i]是<a>元素，那么将innerHTML="<a .... > </a>放在<a tag=LinkTag>和</a>之间。

你需要把它放在DIV中。也许使用您的代码从链接中绘制，然后将相应的HTML代码放入div。

var LinkCount = document.getElementsByTagName('LinkTag').length; 
for (i=0; i<LinkCount; i++) { 

var LinkText = document.getElementsByTagName('LinkTag')[i].getAttribute('contents');
var articleID = document.getElementsByTagName('LinkTag')[i].getAttribute('answer_id');
var articleTitle = document.getElementsByTagName('LinkTag')[i].getAttribute('title');

document.getElementsById('MyDisplayDiv')[i].innerHTML = '<a href="publishing_system_url_id='+ articleID +' title="' + articleTitle + '">' + LinkText + '</a>';

这应该在div中生成HTML结果。您还可以简单地将其他LinkTag元素附加到单个DIV，以在div中生成一种“网站预览”。

document.getElementsById('MyDisplayDiv').innerHTML += '<a href="publishing_system_url_id='+ articleID +' title="' + articleTitle + '">' + LinkText + '</a>';

请注意+=。应将您的HTML制作附加到ID为“MyDisplayDiv”的DIV。您的LinkTag元素列表将转换为div中的HTML元素列表。

Answer 2

DOM functions可能被认为比在这种情况下简单地替换innerHTML更“干净”（并且更快）。这样的事情对你来说可能会更好：

// where el is the element you want to wrap with <a link.
newel = document.createElement('a')
el.parentNode.insertBefore(newel,prop);
el = prop.parentNode.removeChild(prop);
newel.appendChild(prop);
newel.setAttribute('href','urlhere');

类似的代码在Firebug中对我来说很好，它应该用<a> ... </a>包装元素。

Answer 3

我在博客上写了一个脚本，你可以在这里找到：http://blog.funelr.com/?p=61无论如何看看它会自动修复ie8和ie9中的innerHTML错误劫持ie的innerHTML属性是“只读”对于表元素并用我自己的元素替换它。

Answer 4

我有这个xmlObject：

<c:value i:type="b:AccessRights">ReadAccess WriteAccess AppendAccess AppendToAccess CreateAccess DeleteAccess ShareAccess AssignAccess</c:value>

我发现价值使用此：responseXML.getElementsByTagNameNS("http://schemas.datacontract.org/2004/07/System.Collections.Generic",'value')[0].firstChild.data

Answer 5

这是最好的：next
如果您的元素尺寸非常小：n = iter(liste) print(next(n))

替代IE的innerHTML

5 个答案: