:target
JQ Home <<
Selectors <<
:target
Fragment identifier element selector.
Shorthand version $(':target')
Description
The :target selector will selects the target element indicated by the fragment identifier of the document URI.
Syntax
| Signature | Description |
|---|---|
jQuery(':target') | Fragment identifier match |
Parameters
None.
Return
N/A.
:target Example
Selectors << Top
Selects the target element indicated by the fragment identifier of the document URI.
The following example will turn the background colour of the above heading to yellow, but only if you click the link to this part of the page from the Syntax table above. This is because we need to press the link to this section to get it to appear in the URL and hence to be able to modify the ID it pertains to.
$(function(){
$('#btn1').on('click', function() {
alert('Setting element relating to fragment identifier of the document URI to yellow');
$( "h3:target" ).css('backgroundColor', 'yellow');
});
});
Related Tutorials
jQuery Basic Tutorials - Lesson 3 - CSS Selectors