我可以使用Javascript更改HTML元素的ID嗎？

我有javascript變量obj，它表示DOM中的一個元素，我希望更改其ID。我試圖通過以下方式來做到這一點，這也說明它不起作用！我可以使用Javascript更改HTML元素的ID嗎？

obj.id = "newID"; 

alert(obj.id); // this gives me newID as required 

var element = document.getElementById("newID"); 

if (element != null) { alert("Hooray"); // this alert never gets displayed! }

我上面的代碼有什麼問題，這意味着id似乎被更改，但沒有拿到DOM中？提前謝謝了。

來源

2010-09-24 user455141

如何分配'obj'？ – 2010-09-24 13:13:49

在什麼瀏覽器你重現這種情況下？ – HoLyVieR 2010-09-24 13:19:51

是否已將「obj」附加到文檔中？ – Alex 2010-09-24 13:21:00

您顯示的代碼確實有效;問題可能出現在查找並指定obj的代碼中。我的猜測是，這只是一個javascript對象，不是DOM樹的一部分。

來源

2010-09-24 13:21:43

謝謝 - 那正是問題！ – user455141 2010-09-24 14:29:06

-2

可以呀，這裏是用jQuery的解決方案

$("#xxx").attr("id", "yyy");

或

getElementById("xxx").setAttribute("id", "yyy");

來源

2010-09-24 13:11:48

-1 OP沒有指定他們想要使用jQuery，這應該可以使用純JavaScript實現。這並沒有回答他爲什麼改變id的問題，但是它並沒有被'getElementById'找到。 – GenericTypeTea 2010-09-24 13:13:20

javascript相當於obj.setAttribute（「id」，「yourid」） – Tim 2010-09-24 13:13:53

@Tim，實際上是'obj.id =「foo」;'是最簡單的等價物。 – GenericTypeTea 2010-09-24 13:15:43

沒有理由這不應該使用純JavaScript工作。這是一個working fiddle，顯示它正在工作。您不應該需要jQuery解決方案或任何其他JavaScript方法，id = "foo";是更改DOM對象ID的最簡單方法。

看看我的上面的小提琴，試試看看你的代碼和我的代碼有什麼區別。

來源

2010-09-24 13:18:29 GenericTypeTea

既然你不給我們整個代碼我的猜測是，你可能有類似這樣的東西在你的代碼

obj = document.createElement("div"); 
obj.id = "something"; 

// ... 

obj.id = "newID"; 

alert(obj.id); // this gives me newID as required 

var element = document.getElementById("newID"); 

if (element != null) { alert("Hooray"); // this alert never gets displayed! }

在這種特殊情況下，document.getElementById("newID")不會回報你，因爲任何元素未添加到頁面，因此在頁面中找不到。

來源

2010-09-24 13:19:25 HoLyVieR

試試這個：

對我的作品

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <title>test</title> 
</head> 
<body bgcolor="#ffffff"> 

    <script type="text/javascript"> 
     function ChangeID(elementId, newId) { 
      var obj = document.getElementById(elementId); 
      obj.id = newId; 
     } 

     function SetContent(elementId, content) { 
      var obj = document.getElementById(elementId); 
      obj.innerHTML = content; 
     } 
    </script> 

    <div id="div1"></div> 

    <a href="#" onclick="ChangeID('div1', 'div6');">ChangeID</a><br /> 
    <a href="#" onclick="SetContent('div6', 'this is the contents');">Set Contents</a> 





</body> 
</html>

來源

2010-09-24 13:24:43 jimplode

不要在'onclick'屬性中使用'javascript：';它沒用（實際上，你只是以這種方式分配JavaScript標籤）。 – 2010-09-24 13:29:31

剛剛明確。已編輯並刪除。 – jimplode 2010-09-24 13:34:30

您的代碼看起來不錯，但如果你正在評論在您的代碼，這樣，你就可以實現支架是永遠不會關閉，由於該評論。

if (element != null) { alert("Hooray"); // this alert never gets displayed! } <-- this brace

來源

2010-09-24 13:47:29 dytrivedi

+1 - 非常棒！ – 2014-08-20 01:15:36

還有一件事要考慮。您是否在DOM準備好之前嘗試做到這一點？該元素是否已加載？如果您嘗試更改DOM中樹中沒有的元素，您將悄然失敗。

來源

2010-09-24 18:03:10 AutoSponge

我可以使用Javascript更改HTML元素的ID嗎？

回答

相關問題