Link for all dot net and sql server video tutorial playlists
Link for slides, code samples and text version of the video
In this video we will discuss
Attribute Equals Selector [name=”value”]
Attribute Not Equal Selector [name!=”value”]
Attribute Contains Selector [name*=”value”]
Attribute Contains Word Selector [name~=”value”]
Attribute Contains Prefix Selector [name|=”value”]
Attribute Starts With Selector [name^=”value”]
Attribute Ends With Selector [name$=”value”]
This is continuation to Part 7, please watch Part 7 before proceeding.
$(‘[title=”div1Title”]’) // Selects all elements that have title attribute value equal to div1Title
$(‘[title!=”div1Title”]’) // Selects all elements that have title attribute value not equal to div1Title
$(‘[title*=”Title”]’) // Selects all elements that have title attribute value containing the given substring – Title
$(‘[title~=”mySpan”]’) // Selects all elements that have title attribute value containing the given word – mySpan, delimited by spaces
$(‘[title|=”myTitle”]’) // Selects all elements that have title attribute value equal to myTitle or starting with myTitle followed by a hyphen (-)
$(‘[title^=”div”]’) // Selects all elements that have title attribute value starting with div
$(‘[title$=”Heading”]’) // Selects all elements that have title attribute value ending with Heading
Selects all elements that have title attribute value equal to div1Title and sets 5px solid red border
[html]
[head]
[title][/title]
[script src=”Scripts/jquery-1.11.2.js”][/script]
[script type=”text/javascript”]
$(document).ready(function () {
$(‘[title=”div1Title”]’).css(‘border’, ‘5px solid red’);
});
[/script]
[/head]
[body]
[div title=”div1Title”]
DIV 1
[/div]
[br /]
[div title=”div2Title”]
DIV 2
[/div]
[p title=”myTitle-paragraph”]
This is a paragraph
[/p]
[p title=”myTitleHeading”]
This is a paragraph
[/p]
[span title=”div1Title”]
SAPN 1
[/span]
[br /][br /]
[span title=”mySpan Heading”]
SPAN 2
[/span]
[/body]
[/html]
Selects all div elements that have title attribute value not equal to div1Title and sets 5px solid red border
[script type=”text/javascript”]
$(document).ready(function () {
$(‘div[title!=”div1Title”]’).css(‘border’, ‘5px solid red’);
});
[/script]
THIS IS
$(‘div[title!=”div1Title”]’).css(‘border’, ‘5px solid red’);
EQUIVALENT TO
$(‘div:not([title=”div1Title”])’).css(‘border’, ‘5px solid red’);
Selects all elements that have title attribute value containing the given substring – Title, and sets 5px solid red border
[script type=”text/javascript”]
$(document).ready(function () {
$(‘[title*=”Title”]’).css(‘border’, ‘5px solid red’);
});
[/script]
Selects all elements that have title attribute value containing the given word – mySpan, delimited by spaces, and sets 5px solid red border
[script type=”text/javascript”]
$(document).ready(function () {
$(‘[title~=”mySpan”]’).css(‘border’, ‘5px solid red’);
});
[/script]
Selects all elements that have title attribute value equal to myTitle or starting with myTitle followed by a hyphen (-) and sets 5px solid red border
[script type=”text/javascript”]
$(document).ready(function () {
$(‘[title|=”myTitle”]’).css(‘border’, ‘5px solid red’);
});
[/script]
Selects all elements that have title attribute value starting with div and sets 5px solid red border
[script type=”text/javascript”]
$(document).ready(function () {
$(‘[title^=”div”]’).css(‘border’, ‘5px solid red’);
});
[/script]
Selects all elements that have title attribute value ending with Heading and sets 5px solid red border
[script type=”text/javascript”]
$(document).ready(function () {
$(‘[title$=”Heading”]’).css(‘border’, ‘5px solid red’);
});
[/script]
