Home > Developer > JavaScript
Now, you need to select all elements with background images.
This problem is a bit tricky. We cannot use the selection expression to solve this problem.
Using the DOM filter () method of jQuery, you can select elements based on any conditions expressed in the function.
The filter method in jQuery allows passing a string (that is, the selector expression) as a parameter.
Or a function is passed. Its return value defines whether an element is selected.
The passed function runs on each element in the current selection set.
When the function returns false, the corresponding function is deleted from the selection set. When the returned value is true, the corresponding element
Not affected.
Copy codeThe Code is as follows:
JQuery ('*'). filter (function (){
Return !! JQuery(this).css ('background ');
});
The above code Selects all elements with background images.
The initial set contains all elements (*). Then, a function is used as the parameter to call filter ().
This function determines whether there is a property background attribute in each set,
If yes, it is retained. Otherwise, this element is deleted in the result set.
What you see !! It is any undefined or null type in javascript, and of course there is false.
If these values are returned by a function call, the function returns false to delete the values in the set.
Element without the background attribute.
Actually ,!! It is not necessary. Because jQuery converts these return values to the Boolean type, it is still a good idea to keep them.
In this way, when anyone sees your code, they are absolutely sure of your intention. (This helps the code to be readable ).
In the function that passes filter (), you can use the this keyword to reference the current element.
It is included in the jQuery function and becomes a jQuery object.
This // Regular Element Object.
JQuery (this) // jQuery object.
The following are some examples that inspire your imagination.
Copy codeThe Code is as follows:
JQuery ('div '). filter (function (){
Var width = jQuery (this). width;
Return width> 100 & widht <200;
});
// Returns 10 or 20 sub-elements.
JQuery ('*'). filter (function (){
Var children = jQuery (this). childern (). length;
Return children = 10 | children = 20;
});
The following is an example of code: determine the elements with background colors and change all their background colors to black.
Copy codeThe Code is as follows:
<Html>
<Head>
<Title> </title>
<Style type = "text/css">
. C1 {
Background-color: yellow;
}
. C2 {
Background-color: green;
}
P {
Background-color: pink;
}
H3 {
Background-color: gray;
}
</Style>
</Head>
<Body>
<Div class = "c1"> Bye Beautiful </div>
<Div class = "c2"> Nothing but the girl </div>
<P> The Lazy song </p>
<H2> If I die young <H3> New soul <Script type = "text/javascript" src = "jquery.2.0.3.js"> </script>
<Script type = "text/javascript">
JQuery (document). ready (function ($ ){
Var ret = $ ('*'). filter (function (index ){
Return! Background (this).css ('background-color ');
});
$. Each (ret, function (index, val ){
Watermark (val).css ('background-color', 'black ');
});
});
</Script>
</Body>
</Html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
