如果ID以前綴

JQuery替換html元素內容我正在尋找移動或複製HTML元素的內容。這已經被問及之前，我可以得到innerHTML（）或JQuery的html（）方法工作，但我試圖自動化它。如果ID以前綴

如果元素的ID以'rep_'開頭，則在下劃線後替換該元素的內容。

所以，

<div id="rep_target"> 
Hello World. 
</div>

將取代：

<div id="target"> 
Hrm it doesn't seem to work.. 
</div>

我已經試過：

$(document).ready(function() { 
    $('[id^="rep_"]').html(function() { 
     $(this).replaceAll($(this).replace('rep_', '')); 
    }); 
});

- 和 -

$(document).ready(function() { 
    $('[id^="rep_"]').each(function() { 
     $(this).replace('rep_', '').html($(this)); 
    }); 
});

似乎都沒有工作，但是，這並不工作，只能手動：

var target = document.getElementById('rep_target').innerHTML; 
document.getElementById('target').innerHTML = target;

相關，但是這僅僅是文字。 JQuery replace all text for element containing string in id

來源

2012-04-24 Caleb Roseland

哪裏更換從何而來？你想轉移 - 替換（轉移現有的內容來替換目標）？或克隆替換（複製現有內容並替換目標）？ – Joseph 2012-04-24 00:10:06

一般評論：你在你的例子中使用html錯誤：html將一個字符串，而不是一個函數，作爲參數。同樣，你正在使用替換不正確;如果你想改變屬性（任何屬性，包括「id」），你應該使用attr。我認爲後者的困惑來自誤解$（foo）返回的內容：它不是元素的ID，也不是元素本身（或元素）。相反，它是一個圍繞元素的包裝器，類似於[element1，element2，...]，但帶有數組通常不具有的額外方法。希望有所幫助。 – machineghost 2012-04-24 00:22:04

我是JS noob。我需要從id =「rep_target1」中獲取格式化的HTML內容，並替換或附加id =「target1」的內容。基本上，搜索所有具有id =「rep_X」的元素，然後查找並替換id =「X」，頁面上有多個實例具有不同的X值...... – 2012-04-24 22:43:26

第一部分有兩個基本選項：用HTML字符串替換或用實際元素替換。

選項＃1：HTML

$('#target').html($('#rep_target').html());

選項＃2：要素

$('#target').empty().append($('#rep_target').children());

如果你有沒有偏好，後一種選擇是更好的，因爲瀏覽器將不必重新構建所有的DOM位（只要瀏覽器將HTML轉換爲元素，它就會工作並因此影響性能;選項＃2通過不讓瀏覽器創建任何新元素來避免這種工作）。

這應該包括更換內部。你也想改變元素的ID，並且只有一個方法（我知道）

var $this = $(this) 
$this.attr($this.attr('id').replace('rep_', ''));

所以，把他們放在一起，是這樣的：

$('[id^="rep_"]').each(function() { 
    var $this = $(this) 
    // Get the ID without the "rep_" part 
    var nonRepId = $this.attr('id').replace('rep_', ''); 
    // Clear the nonRep element, then add all of the rep element's children to it 
    $('#' + nonRepId).empty().append($this.children()); 

    // Alternatively you could also do: 
    // $('#' + nonRepId).html($this.html()); 

    // Change the ID 
    $this.attr(nonRepId); 

    // If you're done with with the repId element, you may want to delete it: 
    // $this.remove(); 
});

應該做的伎倆。希望有所幫助。

來源

2012-04-24 00:09:40 machineghost

作爲一個附註，您可能注意到這裏有一個模式， html和attr方法：如果你在沒有參數的情況下調用它們，你會返回值，如果你提供了一個參數，你可以將該參數設置爲值。這個模式也適用於jQuery中的很多其他方法（text，val等）。 – machineghost 2012-04-24 00:13:39

這非常接近，但我需要動態地執行選項＃1。像這樣：http://jsfiddle.net/SZUZt/ – 2012-04-24 22:36:03

我編輯了答案，使其更清晰，你可以如何組合這兩部分。我在組合版本中使用了選項＃2，因爲它的性能會更好，但如果您願意，您可以輕鬆替換選項＃1。 – machineghost 2012-04-24 23:50:10

使用attr方法獲取的ID，去掉前綴，從它創建一個選擇，您可以通過元素的HTML代碼，並從函數返回它：

$('[id^="rep_"]').html(function() { 
    var id = $(this).attr('id'); 
    id = id.replace('rep_', ''); 
    var selector = '#' + id; 
    return $(selector).html(); 
});

或者乾脆：

$('[id^="rep_"]').html(function() { 
    return $('#' + $(this).attr('id').replace('rep_', '')).html(); 
});

來源

2012-04-24 00:19:43 Guffa

+1，你也可以使用'this.id' ;-) – 2012-04-24 00:22:05

從我的問題，我的理解是，你想通過刪除re-_前綴來替換id，然後更改該div的內容。這個腳本將做到這一點。

$(document).ready(function() { 
    var items= $('[id^="rep_"]'); 
    $.each(items,function(){ 
     var item=$(this); 
     var currentid=item.attr("id"); 
     var newId= currentid.substring(4,currentid.length); 
     item.attr("id",newId).html("This does not work");   
     alert("newid : "+newId); 
    });  

});

工作示例：http://jsfiddle.net/eh3RL/13/

來源

2012-04-24 00:20:44 Shyju

回答

相關問題