使用Java脚本将标记的内容替换为另一个标记

时间:2012-06-25 04:11:45

标签: javascript

我想替换标签的值

<h2>..</h2>

标签内容

<h3>..<h3>

我写了这样的剧本,

<!DOCTYPE html>
<html>
<body>
<div>
            <h3><span><!-- Start Component Field: {"XPath":"tcm:Content/custom:Content/custom:addwidget[1]/custom:text[1]"} -->
                        <strong>Section Text</strong>
                    </span> </h3>

                <h2>
                        <a title="Google" href="http://google.com">google.com</a>
                    </h2>
            </div>  

        <script type="text/javascript">
        var x=document.getElementsByTagName("div");

        for (var i=0; i<x.length; i++) {
        var children = x[i].getElementsByTagName('h2');

        var demo= children["demo"].innerHTML;


        var childd =x[i].getElementsByTagName('h3');

        var all=childd["all"].innerHTML;



        children["demo"].childNodes[0].innerHTML=all;
        childd["all"].innerHTML=null;
        }

        </script>

</body>
</html> 

规则:

在上面的示例中,我想将“google.com”替换为<h3>标记中的文字。 但我没有得到输出。

需要输出。

    <!DOCTYPE html>
<html>
<body>
<div>

                <h2>
                        <a title="Google" href="http://google.com">
                        <span><!-- Start Component Field: {"XPath":"tcm:Content/custom:Content/custom:addwidget[1]/custom:text[1]"} -->
                            <strong>Section Text</strong>
                        </span> 
                        </a>
                    </h2>
            </div>  


</body>
</html> 

我没有得到确切的输出。 我已经使用了循环,因为我想在每次出现div标签时都这样做。

任何人都可以查看它并建议如何纠正它。

感谢。

2 个答案:

答案 0 :(得分:6)

这应该简单如下:

document.getElementById('demo').innerHTML = document.getElementById('all').innerHTML​;​

编辑:使用新的HTML代码,您可以将所有<h2>替换为<h3>,如此。

var divs = document.getElementsByTagName('div');
for(var i = 0, len = divs.length; i < len; i++){
    var div = divs[i],
        h2 = div.getElementsByTagName('h2'),
        h3 = div.getElementsByTagName('h3');

    if(h2.length === 1 && h3.length === 1){
        h2[0].innerHTML = h3[0].innerHTML;
    }
}

答案 1 :(得分:0)

jQuery解决方案:

$('#demo').html($('#all').html());