爲什麼不附加（）與輸入標籤一起工作？

Question

我想在提交按鈕的值後追加<i>Some Text</i>。如果我像在代碼片段中那樣用HTML編寫它，它可以工作，但如果我使用jQuery來追加它，那麼它可以部分工作。

部分地，我的意思是如果你打開開發工具，附加的文本存在，但它不會顯示在瀏覽器屏幕上。

爲什麼會出現這種情況？

$(document).ready(function(){ 
 
    $('.tryout').append('<i>Hello</i>'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<input class="tryout" type="submit"></input> 
 

 
<hr> 
 

 
<input type="submit"><i>Hello</i></input>

Answer 1

不能附加任何東西，輸入元素，使用按鈕，而不是

$(document).ready(function() { 
 
    $('.tryout').append('<i>Hello</i>'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<button class="tryout" type="submit"></button> 
 

 
<hr> 
 

 
<button type="submit"><i>Hello</i></button>

---

或者，如果你願意，你可以插入新元素一個使用.after（）的按鈕的兄弟（如$('.tryout').after('<i>Hello</i>');

Answer 2

您需要使用.after代替.append()某些元素之後追加要素：在一套匹配

插入內容，由指定的參數，每個元素後元素。

$('.tryout').after('<i>Hello</i>');