Javascript 在IE中动态设置输入元素的id属性：setAttribute方法的替代方法

我正在研究动态设置HTML输入元素的ID属性，这些元素是在我的应用程序中动态创建的

我的实现与Firefox中的setAttribute方法配合得很好。如有任何关于IE工作实现的想法或解决方案，将不胜感激

 var hiddenInput = document.createElement("input");
    hiddenInput.setAttribute("id", "uniqueIdentifier");
    hiddenInput.setAttribute("type", "hidden");                     
    hiddenInput.setAttribute("value", ID);
    hiddenInput.setAttribute("class", "ListItem");

我修改了与此问题相关的博客中的一些示例代码，建议进行以下工作。同样，Firefox位工作正常，但IE位不工作

var hiddenInput = null;

try { 
hiddenInput  = document.createElement('<input name=\''+"hiddenInputName"+'\'   />');
                    hiddenInput.id = "uniqueIdentifier";
                    //alert(document.getElementById("uniqueIdentifier")); 
                   hiddenInput.type = "hidden";
                } catch (e) { }            
                if (!hiddenInput || !hiddenInput.name) { // Not in IE, then
                     var hiddenInput = document.createElement("input");
    hiddenInput.setAttribute("id", "uniqueIdentifier");
    hiddenInput.setAttribute("type", "hidden");                     

            }

var hiddenInput=null；
试试{
hiddenInput=document.createElement（“”）；
hiddenInput.id=“uniqueIdentifier”；
//警报（document.getElementById（“uniqueIdentifier”）；
hiddenInput.type=“隐藏”；
}捕获（e）{}
如果（！hiddenInput | |！hiddenInput.name）{//不在IE中，则
var hiddenInput=document.createElement（“输入”）；
setAttribute（“id”、“唯一标识符”）；
setAttribute（“类型”、“隐藏”）；
}

---

干杯。

我不知道IE中的

setAttribute

有问题？但是，您可以直接在节点本身上设置expando属性：

hiddenInput.id = "uniqueIdentifier";

使用jquery方法。它适用于所有浏览器

var hiddenInput = document.createElement("input");
$(hiddenInput).attr({
    'id':'uniqueIdentifier',
    'type': 'hidden',
    'value': ID,
    'class': 'ListItem'
});

或者您可以使用以下代码：

var e = $('<input id = "uniqueIdentifier" type="hidden" value="' + ID + '" class="ListItem" />');

var e=$（''）；

上面写着：

当您需要设置也映射到JavaScript点属性（如href、style、src或事件处理程序）的属性时，请使用该映射

所以，只要更改id，值赋值，你就应该完成。

忘记

setAttribute（）

：它严重损坏，并不总是像你在旧IE中期望的那样（即IE7和Chrome中的这项工作：

var hiddenInput = document.createElement("input");
    hiddenInput.setAttribute("id", "uniqueIdentifier");
    hiddenInput.setAttribute("type", "hidden");                     
    hiddenInput.setAttribute("value", 'ID');
    hiddenInput.setAttribute("class", "ListItem");

$('body').append(hiddenInput);

---

其他地方可能有问题吗？

我也有同样的问题！我无法更改/设置元素的ID属性。它在所有其他浏览器中都有效，但在IE中无效。这可能与您的问题无关，但我最后做的是：

背景

我正在用jquery选项卡构建一个MVC站点。我想动态创建选项卡，并将选项卡保存在数据库中，然后向服务器进行AJAX回发。我想为选项卡使用一个唯一标识符，以int的形式，这样，如果用户创建了两个同名选项卡，我就不会遇到麻烦。然后，我使用唯一ID来标识选项卡例如：

<ul>
<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close'>Remove List</span></li>
<ul>

问题是span标记没有任何ID。因此在create回调中，我尝试设置ID buy，从a href提取ID，如下所示：

ui.tab.parentNode.id = ui.tab.href.substring(ui.tab.href.indexOf('#list-') + 6);

这在FireFox中运行良好，但在IE中不起作用。因此我尝试了其他几种：

//ui.tab.parentNode.setAttribute('id', ui.tab.href.substring(ui.tab.href.indexOf('#list-') + 6));
//$(ui.tab.parentNode).attr({'id':ui.tab.href.substring(ui.tab.href.indexOf('#list-') + 6)});
//ui.tab.parentNode.id.value = ui.tab.href.substring(ui.tab.href.indexOf('#list-') + 6);

所以经过几个小时的测试和谷歌搜索，我放弃了，并得出结论，IE不能动态设置元素的ID属性

我很难过，这可能与你的问题无关，但我想我会与你分享

解决方案

对于所有通过谷歌搜索我的标签问题发现这个问题的人，这里是我在tabsremove回调中为解决这个问题而做的事情：

var dbIndex = event.currentTarget.offsetParent.childNodes[0].href.substring(event.currentTarget.offsetParent.childNodes[0].href.indexOf('#list-') + 6);

---

可能不是最性感的解决方案，但它解决了这个问题。如果有人有任何意见，请分享…

有趣的是，通过检查code.jquery.com/jquery-latest.js，它已经在版本

1.5.0

：）上，看起来它很快就会发布。谢谢。我会使用JavaScript工具包——我很欣赏JQuery——但我有点受限，因为我正在使用的站点没有充分利用JQuery，我只是试图保持一致性。直接分配ID似乎对我不起作用。例如，在分配之后，我会调用alert（document.getElementByID（“uniqueIdentifier”）；它返回null:=（感谢

id

不是expando，它是一个DOM属性。IE的

setAttribute（）

实现被严重破坏：通常，它将属性映射到属性。这意味着“类”属性不能正常工作，例如：等效属性是

className

。这也意味着事件处理程序属性不能工作，因为

setAttribute（）

应该期望字符串属性值，但事件处理程序属性必须是函数对象。@TimDown:谢谢你的解释。

.id

是“DOM属性”，但它不是ECMALand中的对象属性吗？它是宿主对象的属性，所以是的。我的观点是“expando”"对于IE中的DOM元素具有特殊意义，它是元素上的任意用户定义属性。

不可选择

在IE中作为expando实现。有关MSDN:，有一些信息与

document.expando

属性有关，可用于禁用在文档中任何位置添加expandos的功能nt.“文档”？您是指既不定义标准也不实施标准的站点（即Sitepoint）。不过，我确实同意。好吧，这不是官方文档，但他们很好地描述了这个问题。您测试的是哪个版本的IE？哪些版本不起作用？是否有错误消息？出现了什么问题？当我调用alert-un comment alert（document.getElementByID（“uniqueIdentifier”））；在try块中-它返回空对象。因此，id属性的赋值-hiddenInput.id=“uniqueIdentifier”-在IE8中对我不起作用。我想知道这是为什么？@Terman:在调用

alert（）

的时候，输入还没有在文档中，因此

文档.getElementById（）

call返回空值。请参阅我的更新答案。感谢大家的评论和贡献。我最终放弃了setAttribute（）方法并利用innerHTML属性.Cheerrescheers。看起来我已经尝试过了，但我会尝试一下go@Tim很抱歉打断您。但是当我编写代码var hiddenInput=document.createElement（“输入”）；hiddenInput.id=“uniqueIdentifier”o时

//ui.tab.parentNode.setAttribute('id', ui.tab.href.substring(ui.tab.href.indexOf('#list-') + 6));
//$(ui.tab.parentNode).attr({'id':ui.tab.href.substring(ui.tab.href.indexOf('#list-') + 6)});
//ui.tab.parentNode.id.value = ui.tab.href.substring(ui.tab.href.indexOf('#list-') + 6);

var dbIndex = event.currentTarget.offsetParent.childNodes[0].href.substring(event.currentTarget.offsetParent.childNodes[0].href.indexOf('#list-') + 6);