The js method is much more troublesome than the jq method, mainly because the FF browser also regards the line feed as the dom element, the following is a small Editor to learn about jsjquery's getting the current element from the sibling level. If you need a friend to learn it, var chils = s. childNodes; // obtain all child nodes of s.
Var par = s. parentNode; // obtain the parent node of s.
Var ns = s. nextSbiling; // obtain the next sibling node of s.
Var ps = s. previussbiling; // obtain the previous sibling node of s.
Var fc = s. firstChild; // obtain the first subnode of s.
Var lc = s. lastChile; // obtain the last subnode of s.
JS obtains the node parent and child elements.
First, let's talk about how to obtain JS, which is much more troublesome than JQUERY's method. Later we will compare it with JQUERY's method.
The JS method is much more troublesome than JQUERY, mainly because FF browser, FF browser will treat your line feed as a DOM Element
Native JS gets the child element under the element with ID test.
Available:
var a = docuemnt.getElementById("test").getElementsByTagName_r("p");
There is no problem.
A. length = 2;
But if we use another method
var b =document.getElementByIdx_x("test").childNodes;
At this time, B. length is no problem in IE browser, it is still equal to 2, but in FF browser, it will make 4, because FF also regards line feed as an element.
Therefore, here we have to deal with it. We need to traverse these elements and delete all elements of the space type and text.
Function del_ff (elem) {var elem_child = elem. childNodes; for (var I = 0; I
The preceding function traverses sub-elements. When the node type in the element is text and the node value of the text type node is empty. Delete it.
NodeNames can obtain the node type of a node, and the regular expression of the/\ s/non-null character in JS. Add above !, It is a null character.
The test () method is used to check whether a string matches a certain pattern. The syntax is RegExpObject. test (string)
If the string contains the text that matches RegExpObject, true is returned; otherwise, false is returned.
NodeValue indicates that the value in the node is obtained.
RemoveChild is the child element that deletes an element.
Then, before calling the sub-, parent, and brother attributes, call the above function to clear the spaces.
Script function dom () {var s = document. getElementByIdx_x ("test"); del_ff (s); // clear spaces var chils = s. childNodes; // obtain all the subnodes var par = s. parentNode; // obtain the parent node var ns = s. nextSbiling; // obtain the next sibling node var ps of s = s. previussbiling; // obtain var fc = s from the previous sibling node of s. firstChild; // obtain the first subnode var lc = s. lastChile; // obtain the last child node of s} script
The following describes how to find JQUERY's parent, child, and sibling nodes.
JQuery. parent (expr) finds Father's Day points and can pass in expr for filtering, for example, $ ("span "). parent () or $ ("span "). parent (". class ")
JQuery. parents (expr) is similar to jQuery. parents (expr), but it is used to find all ancestor elements, not limited to parent elements.
JQuery. children (expr). Return all child nodes. This method only returns the direct child node and does not return all child nodes.
JQuery. contents (), which returns all the following content, including the node and text. The difference between this method and children () is that, including blank text
JQuery object, children () Only returns nodes
JQuery. prev (), returns the previous sibling node, not all sibling nodes
JQuery. prevAll (), returns all previous sibling nodes
JQuery. next (), returns the next sibling node, not all sibling nodes
JQuery. nextAll (), returns all the following sibling nodes
JQuery. siblings (), returns the siblings node, regardless of the front and back
JQuery. find (expr) is completely different from jQuery. filter (expr. JQuery. filter () is a part of the initial jQuery object set, while jQuery. find ()
NO content in the initial set, for example, $ ("p"), find ("span"), is from
Element search, equivalent to $ ("p span ")
The above introduction is the next element in the sibling level of the current element obtained by js jquery. I hope it will be helpful to you.