javascript - Javascript-删除线

我尝试使用javascript制作文本删除线。
我对Javascript一无所知，并尝试在网上搜索如何实现。

 <script language="JavaScript">
            function recal(val,sum)
            {
                if(sum == true)
                {
                    var total = parseInt(document.getElementById("total").innerHTML, 10);
                    total+=val;
                    document.getElementById("total").innerHTML=total;
                }
                else
                {
                    var total = parseInt(document.getElementById("total").innerHTML, 10);
                    total-=val;
                    document.getElementById("total").innerHTML=total;
                    var pnl = document.getElementById("totalEvents");
                }



                var pnl = document.getElementById("totalEvents");
                var pnl2 = document.getElementById("eventCategory");
                var pnl3 = document.getElementById("nameID");

                **strikethrough starts here**
                if (!sum && pnl.firstChild.tagName != "S" && pnl2.firstChild.tagname !="S")
                {
                    pnl.innerHTML = "<S>"+ pnl.innerHTML+"</S>";
                    pnl2.innerHTML = "<S>"+ pnl2.innerHTML+"</S>";
                }
                else
                {
                    pnl.innerHTML = pnl.firstChild.innerHTML;
                    pnl2.innerHTML = pnl2.firstChild.innerHTML;
                }



            }
        </script>

它使文字删除线变通，但是出了点问题。即使我选择第二个复选框，它也会影响第一个复选框，为什么:(

http://jsfiddle.net/aHH9w/(我的完整html页)

最佳答案

您正在采用一种非常复杂的方法来实现此目标，而实际上这很容易完成。如果您有HTML元素，请使用id“myelement”说:

<div id="myelement">Hello world</div>

要创建删除线，在JS中需要做的就是:

var ele = document.getElementById("myelement");
ele.style.setProperty("text-decoration", "line-through");

如果需要检查元素上是否有删除线:

var ele = document.getElementById("myelement");
var isStruck = (ele.style.getProperty("text-decoration") == "line-through");

虽然这不是真的建议。使用内部变量来跟踪状态。