jQuery selectors -> all TD within a specific table
I am still learning jQuery an开发者_运维知识库d the selector bit is incredibly useful, but I still don't understand it perfectly well.
I have a table with id=table1, and I want to select all td's in this table.
(really I want to wrap the text within each td with a div with overflow:hidden so I can force the cell heights to be uniform.)What's the appropriate syntax for the jQuery (javaScript?) selector?
Any links to awesome selector tutorials are also welcome.
The following should do the trick
$('#table1 td').wrapInner('<div class="no-overflow"></div>');
and add a css rule in your stylesheet
.no-overflow{
overflow:hidden;
/*and whatever other css properties here*/
}
For completeness here is the documentation about
wrapInner()
- all selectors
- the Descendant Selector jQuery('ancestor descendant') that we used in this situation
This will select all the cells:
$("#table1 td")
jQuery uses CSS3 selectors, read about them here: http://api.jquery.com/category/selectors/
$("#table1").find("td");
$("#table1 td").each(function() {
var text = $(this).html();
var div = $("<div class=hiddenOverflow></div>");
div.html(text);
$(this).html(div);
});
精彩评论