Shulou(Shulou.com)06/01 Report--

This article focuses on "CSS context selector and how to use DOM nodes". Interested friends may wish to have a look at it. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn "CSS context selector and how to use DOM nodes".

Selector Context (context selector)

By default, the selector performs the search from the document root node. However, you can pass the $() function a second optional parameter for context retrieval (note: the second context parameter is used to specify the scope of the selector lookup). For example, if we want to do a search for an element in a callback function, we can limit the scope of the search:

$("div.foo") .click (function () {

$("span", this) .addClass ("bar")

})

Since we restrict the context of this span selector to this, only the span in the clicked element will be styled.

Within jQuery, the selector context uses the .find () method, so $('span', this) is equivalent to $(this). Find (' span').

Using DOM elements (using DOM nodes)

The second and third ways of this function create a jQuery object using one or more DOM elements or elements that we have found in some other way.

Note: these methods mean that only DOM elements are consumed; sending mixed data to elementArray (array of elements) is particularly encouraged.

This device generally uses the jQuery method to pass the this keyword through a callback function:

$("div.foo") .click (function () {

(this) .slideUp ()

})

In this example, sliding animation is used when clicking to hide these elements. Because event handling receives the clicked element through the this keyword, but the element is a native DOM element, you need to convert it to a jQuery object through the $() function, and then you can call the jQuery method on that jQuery object.

When an Ajax request returns XML data, we can use the $() method to include it in the jQuery object, and we can easily work. Once this is done, we can use .find () and other DOM traversal methods to retrieve specific elements in the XML structure.

$.post ("url.xml", function (data) {

Var $child = $(data) .find ("child")

})

Cloning jQuery Objects (Clone jQuery object)

When a jQuery object is passed as an argument to the $() method, a cloned object of that object is created. This new jQuery object references the same DOM element.

Returning an Empty Set (returns an empty collection)

In jQuery 1.4, if you pass an empty argument to the jQuery () method, an empty jQuery setting will be returned (.length property is 0). In previous versions of jQuery, a collection containing the entire document node would be returned.

At this point, I believe you have a better understanding of "CSS context selector and how to use DOM nodes". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.