Javascript 更改id'；TD标签的数量不是永久的_Javascript

Javascript 更改id'；TD标签的数量不是永久的

javascript

Javascript 更改id'；TD标签的数量不是永久的,javascript,Javascript,我想动态更改TD标签的Id。我试着跟着 var div_node; div_node = document.getElementById(old_id); div_node.id = new_id; 但改变Id的效果并不是永久的。如果我在这之后写一些语句，它只给出原始id。我的意思是，如果我发出警报（div_node.id），它只给出原始id 这是我的全部计划 jsAnim.js是javascript库。我已经包括在内了。可在函数Assign\u id（）//此

我想动态更改TD标签的Id。我试着跟着

var div_node;           

div_node = document.getElementById(old_id);

div_node.id = new_id;

但改变Id的效果并不是永久的。如果我在这之后写一些语句，它只给出原始id。我的意思是，如果我发出警报（div_node.id），它只给出原始id

这是我的全部计划

jsAnim.js是javascript库。我已经包括在内了。可在


函数Assign\u id（）//此函数将执行onload
{
j=0；
对于（i=1；i您是否存在ID冲突？每个ID在页面上都应该是唯一的。乍一看，我在您的代码中没有看到任何安全防护措施
为了排除这种情况，您还需要在设置动画之前更改id。
您获得id为旧id
的元素，然后将其id设置为新id

然后，您将获得ID为new\u ID
的元素。这是与上面相同的元素（因为您只需将其ID设置为new\u ID
），然后再次将此元素ID设置为old\u ID

div\u node
和div\u node1
是同一个元素。您只需交换ID，然后再将其交换回来。
什么是jsAnimManager
？什么是jsAnim.js，不能只保留代码，可能存在问题，还有您交换ID的理由是什么？为什么不只做类？（样式/位置？）不要使用“setAttribute（）”来设置“Assign_id（）”函数中DOM元素的“id”。只需将其直接设置为对象上的属性，就像您在其余代码中所做的那样。@Neal和Jakub:jsAnim.js是库。根据您的建议，我更改了我的change_id函数，如下所示，但它不更改var div_节点的id；var temp=“0”“div_node=document.getElementById（旧id）；div_node.id=temp；var div_node1=document.getElementById（新id）；div_node1.id=old_id；var div_node2=document.getElementById（temp）；div_node2.id=new_id；警报（div_node2.id）；警报（div_node1.id）；”
<html>
<head>
    <script type="text/javascript" src="jsAnim.js"> </script>

        <script>

        function Assign_id()   //This function Will execute onload
        {
        j=0;
        for(i=1;i<4;i++)C
        {
            document.getElementsByTagName("td")[j].setAttribute("id",i);
            //alert(document.getElementsByTagName("td")[j].id);
            j++;
        }
        }

        function getdata()
        {
            var old_id=prompt("Enter Box Id.");
            var new_id=prompt("Enter New Position");
            animate(old_id,new_id);
            change_id(old_id,new_id);

        }

        function animate(old_id,new_id)
        {
            var manager=new jsAnimManager();
            obj=document.getElementById(old_id);
            obj.style.position="relative";
            var anim=manager.createAnimObject(old_id);
            anim.add({property: Prop.top, to: 100, duration: 2000});
            anim.add({property: Prop.left, to: ((new_id-old_id)*50)+4, duration: 2000});
            anim.add({property: Prop.top, to: 0, duration: 2000});

            obj=document.getElementById(new_id);
            obj.style.position="relative";
            var anim=manager.createAnimObject(new_id);
            anim.add({property: Prop.bottom, to: 100, duration: 2000});
            anim.add({property: Prop.right, to: ((new_id-old_id)*50)+4, duration: 2000});
            anim.add({property: Prop.bottom, to: 0, duration: 2000});
        }

        function change_id(old_id,new_id)
        {
            var div_node;
            div_node = document.getElementById(old_id);
            div_node.id = new_id;
            alert(div_node.id);     //HERE IT IS GIVING CORRECT CHANGED ID;

            var div_node1 = document.getElementById(new_id);
            div_node1.id = old_id;

            alert(div_node.id);     //BUT HERE IT AGAIN GIVE ORIGINAL ID ONLY
            alert(div_node1.id);
        }
    </script>
</head>



<body onload="Assign_id()">

    <table border="1" cellpadding="0" cellspacing="0">
    <tr>

    <td width="50" height="100" background="pic.png">
    <font size="10" align="center">A</font>
    </td>

    <td width="50" height="100" background="pic.png">
    <font size="10" align="center">B</font>
    </td>


    <td width="50" height="100" background="pic.png">
    <font size="10" align="center">C</font>
    </td>
    </tr>
    </table>

    <button onclick="getdata()"> NEXT </button>

</body>
</html>