Jquery選擇器<td/>

Question

-我正在學習Jquery。我不明白在這個代碼這個$('<td/>')選擇：

$('<td/>').insertAfter($(this)).text(height).css('border', 'thin solid red'); 

- 可以任何一個告訴我是什麼呢？

Answer 1

$('<td/>')創建一個帶有標記td的DOM元素。

insertAfter($(this))在this元素後附加元素。

.text(height)更改td標記內的文本。

最後，.css('border', 'thin solid red');將紅色邊框應用於td元素。

Answer 2

$('<td/>')創建一個新的空白<td>元素並將其包裝在jQuery對象中。

這將是相同的，就像您創建了純JavaScript的元素，然後使用$('.selector')進行選擇。

Answer 3

讓我們打破這種分解成各個組成部分，也許這將是更有益的：

$('<td/>') // this is initializing a new DOM Node. At this point, however, it's not actually connected to anything, it's just a DOM Node hanging out in the DOM and not attached to the document flow. 

.insertAfter($(this)) // now, this is telling jQuery to take that TD element you just created, and insert it after whatever $(this) evaluates to... assuming this is inside, say, a click handler, it would evaluate to the object that triggered the click event, and attach the TD element after "this" element. 

.text(height) // says, "set the .text of your TD element to whatever is in the height variable" ... you're basically plugging text inside your TD element. 

.css('border', 'thin solid red') // is telling jQuery to modify the TD's style, adding a style for border that is thin, solid and red. 

見我一起扔的jsfiddle有關如何這會工作的一個例子的例子。 http://jsfiddle.net/mori57/xLJHx/

（一個有趣的後續問題應該提出自己，如果你嘗試我聯繫你玩弄了的jsfiddle，但我並不想在這裏把水攪渾）