0

我创建的 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 中使用它，这将是一个巨大的生产力提升。任何想法将不胜感激。

4

5 回答 5

2

innerHTML 仅适用于打开/关闭标签内部的内容。因此，例如，如果您LinkTag[i]是一个<a>元素，那么 putinnerHTML="<a .... > </a>会将其放在<a tag=LinkTag>and之间</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 元素列表。

于 2012-06-25T17:36:39.480 回答
0

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

于 2013-11-27T07:59:08.223 回答
0

在这种情况下，与简单地替换 innerHTML 相比， DOM 函数可能被认为更“干净”（并且更快）。像这样的东西可能对你更有效：

// 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>.

于 2012-06-25T18:09:00.480 回答
0

我有这个 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

于 2016-05-11T19:16:52.367 回答
-1

  1. 这个是最好的：elm.insertAdjacentHTML( 'beforeend', str );

  2. 如果您的元素尺寸非常小：elm.innerHTML += str;

于 2018-04-19T06:56:13.630 回答