1

对于兼容性问题，我使用了一个生成的 HTML，它有一个带有一行链接的表格。

加载页面后，我立即删除链接并将其转移innerHTML到链接的父元素。我尝试使用 jQuery 方法来执行此操作html()。

但我注意到该方法的一个有趣行为使事情变得复杂。当我将innerHTML链接元素复制到另一个元素时，它会自动分离。我通过将innerHTML链接复制到临时数组并将其插入到父元素中来实现了一种解决方法。

谁能解释这种行为？

我使用的 JavaScript/jQuery 代码：

function rmvMenuLinks()
   {var txt = new Array();
    for(var indx=0; indx < $("td.menuhead").length; indx++) {    
        $("td.menuhead").eq(indx).html($("a.menuhead").eq(indx).html());           
       } 
    $("a.menuhead").detach();                                                     
   }
4

2 回答 2

0

我假设 thea是tdthen的子元素

function rmvMenuLinks(){
    $("td.menuhead").each(function(idx){
        var $this = $(this), $a = $this.find('a');
        $this.append($a.contents());
        $a.remove()
    });
}

别的

function rmvMenuLinks(){
    $("td.menuhead").each(function(idx){
        var $a = $("a.menuhead").eq(idx), $this = $(this);
        $this.append($a.contents());
    });
    $("a.menuhead").remove();
}
于 2013-06-05T08:10:16.763 回答
0

我是否正确理解每个td.menuhead元素都有一个子元素 the a.menuhead，并且您想从该a元素中获取 HTML 并将其填充到in 中td，而a在此过程中消失？

如果是这样，我会这样做：

function rmvMenuLinks() {
    $('a.menuhead').each( function( i, a ) {
        var $a = $(a);
        $a.parent().html( $a.html() );
    });
}

或者，如果您想要实际的 DOM 元素而不转换为 HTML：

function rmvMenuLinks() {
    $('a.menuhead').each( function( i, a ) {
        var $a = $(a);
        $a.parent().empty().append( $a.contents() );
    });
}

您列出的原始循环有一些问题。首先，它非常低效。您td.menuhead在每次迭代中运行选择器两次，以及a.menuhead一次选择器。与上面的代码相比，它只使用一个选择器并且只运行一次。

更重要的是，我宁愿怀疑这段代码没有达到您的预期：

$("a.menuhead").eq(indx)

第一次通过循环indx是 0，这给了你预期的结果，第一个a.menuhead元素。但是现在代码从 DOM中删除.html()该元素，当它设置父td元素的时。

所以第二次通过循环，indx是 1，但你已经删除了第一个a.menuhead，所以现在你引用第三个 a.menuhead- 或者你删除第一个之前的第三个是什么。a.menuhead

你正在跟着我吗？如果我没有解释清楚，请告诉我。

于 2013-06-05T07:53:36.533 回答