如何使用.append（）和appendTo（）添加我們想要的元素？

當我點擊一個鏈接時，我嘗試添加一個字段集。如何使用.append（）和appendTo（）添加我們想要的元素？

我會認爲這個新元素在我的範圍之前，因爲在這個時候元素被添加了。

<fieldset id="fieldsetOptions"> 
<legend>Options</legend> 
<span>Add an option 
    <a onclick="addOption()" href="javascript:return false;"> 
    <img src="./images/icons/add.png"> 
    </a> 
</span> 
<fieldset><!--this is the new fieldset, but not at the good place--></fieldset> 
</fieldset>

所以，你明白：良好的結果應該是這個

<fieldset id="fieldsetOptions"> 
<legend>Options</legend> 
<fieldset><!--this is the new fieldset, at the good place--></fieldset> 
<span>Add an option 
    <a onclick="addOption()" href="javascript:return false;"> 
    <img src="./images/icons/add.png"> 
    </a> 
</span>  
</fieldset>

要添加新的字段集，我這樣做：

<script type="text/javascript"> 
    function addOption(){ 
    $("#fieldsetOptions").append("<fieldset></fieldset>"); 
    } 
</script>

是否有可能加入其中我們想要？

來源

2011-07-19 bahamut100

內嵌的JavaScript（'的onclick = 「... 」'）和'HREF =「 JavaScript的：」 ......'是完全DIS推薦的，尤其是* *當你已經擁有的東西像jQuery的地方。 – Tomalak

感謝提示 – bahamut100

$("#fieldsetOptions legend").after("<fieldset></fieldset>");

這應該做的伎倆。它使用after在#fieldsetOptions的子legend之後插入新元素。

來源

2011-07-19 09:37:36

prepend也是一個函數，你有前後方法。如果你想要它之間的元素，prepend和append不會工作，之前和之後可以做到這一點。在準備功能

$("#fieldsetOptions > span > a").click(function() { 
    $(this).closest('span').before("<fieldset></fieldset>"); 
});

（並給予錨一類特殊效果會更好）：我不會用的onclick，但用這個。

來源

2011-07-19 09:34:25 Johan

這將在跨度之前插入新元素，但如果您打算在將來擁有更多跨度，則應至少爲跨度賦予一個類，以便您只能定位所需的跨度。

<script type="text/javascript"> 
    function addOption(){ 
    $("#fieldsetOptions > span").before("<fieldset></fieldset>"); 
    } 
</script>

http://api.jquery.com/before/

來源

2011-07-19 09:37:40

如何使用.append（）和appendTo（）添加我們想要的元素？

回答

相關問題