jQuery .append（）將所需的類添加到表單元素

Question

我希望我的HTML5表單獲得必填字段的星號（'*'） - 我可以添加required作爲屬性，但表單輸出的其餘部分由於我們使用的軟件，有點麻煩。

我有以下jQuery的工作，它尋找required的屬性，然後附加一個<span>元素。

$('*[required]').prev().append('<span class="required">*</span>'); 

我不使用jQuery經歷了那麼這是一種有效的方式足以對目標具，比如說一個形式，10個必需的元素？或者可以改進，例如.appendTo()或.insertAfter()更合適嗎？

Answer 1

你可以做到這一點使用.before()改善：

$(':input[required]').before('<span class="required">*</span>'); 

Answer 2

操縱dom總是很昂貴，但是你的方法確實有效。但我會用CSS選擇器來做到這一點，因爲從技術上講，這是一個視覺上的事情。如果您支持較舊的瀏覽器，則您的方法沒問題。這裏是一個更簡化版本

只是一個例子：

$('[required]').wrap('<span class="required">*</span>'); 

這將包裹輸入的跨度，但你也可以換你的上一個元素。

Answer 3

假設你的代碼工作，你都在思考：

所以這是一個足夠有效的方式來定位與形式，說，10 所需的元素？

*是非常無效的選擇器;它匹配一切。這意味着，例如，如果您的DOM有1000個元素，瀏覽器必須檢查所有元素是否存在必需的屬性。具體可能的情況下：

$("input[required], select[required], textarea[required]") 

或可能是改進，例如.appendTo（）或.insertAfter（）更適合 ？

這取決於*應該去的地方。所以使用有意義的功能。