eq
.eq( index )Returns: jQuery
Description: Reduce the set of matched elements to the one at the specified index.
Given a jQuery object that represents a set of DOM elements, the .eq() method constructs a new jQuery object from one element within that set. The supplied index identifies the position of this element in the set.
Consider a page with a simple list on it:
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
</ul>
We can apply this method to the set of list items:
$( "li" ).eq( 2 ).css( "background-color", "red" );
The result of this call is a red background for item 3. Note that the supplied index is zero-based, and refers to the position of the element within the jQuery object, not within the DOM tree.
index
.index()Returns: Integer
Description: Search for a given element from among the matched elements.
Return Values
If no argument is passed to the .index() method, the return value is an integer indicating the position of the first element within the jQuery object relative to its sibling elements.
If .index() is called on a collection of elements and a DOM element or jQuery object is passed in, .index() returns an integer indicating the position of the passed element relative to the original collection.
If a selector string is passed as an argument, .index() returns an integer indicating the position of the first element within the jQuery object relative to the elements matched by the selector. If the element is not found, .index() will return -1.
append
.append( content [, content ] )Returns: jQuery
Description: Insert content, specified by the parameter, to the end of each element in the set of matched elements.
version added: 1.0.append( content [, content ] )
content
Type: htmlString or Element or Text or Array or jQuery
DOM element, text node, array of elements and text nodes, HTML string, or jQuery object to insert at the end of each element in the set of matched elements.
content
Type: htmlString or Element or Text or Array or jQuery
One or more additional DOM elements, text nodes, arrays of elements and text nodes, HTML strings, or jQuery objects to insert at the end of each element in the set of matched elements.
version added: 1.4.append( function )
function
Type: Function( Integer index, String html ) => htmlString or Element or Text or jQuery
A function that returns an HTML string, DOM element(s), text node(s), or jQuery object to insert at the end of each element in the set of matched elements. Receives the index position of the element in the set and the old HTML value of the element as arguments. Within the function, this refers to the current element in the set.
The .append() method inserts the specified content as the last child of each element in the jQuery collection (To insert it as the first child, use .prepend()).
The .append() and .appendTo() methods perform the same task. The major difference is in the syntax-specifically, in the placement of the content and target. With .append(), the selector expression preceding the method is the container into which the content is inserted. With .appendTo(), on the other hand, the content precedes the method, either as a selector expression or as markup created on the fly, and it is inserted into the target container.
Consider the following HTML:
<h2>Greetings</h2>
<div class="container">
<div class="inner">Hello</div>
<div class="inner">Goodbye</div>
</div>
You can create content and insert it into several elements at once:
$( ".inner" ).append( "<p>Test</p>" );
Each inner <div> element gets this new content:
<h2>Greetings</h2>
<div class="container">
<div class="inner">
Hello
<p>Test</p>
</div>
<div class="inner">
Goodbye
<p>Test</p>
</div>
</div>
length
lengthReturns: Integer
Description: The number of elements in the jQuery object.
version added: 1.0length
The number of elements currently matched. The .size() method will return the same value.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>length demo</title>
<style>
body {
cursor: pointer;
}
div {
width: 50px;
height: 30px;
margin: 5px;
float: left;
background: green;
}
span {
color: red;
}
</style>
<script src="jquery-1.10.2.js"></script>
</head>
<body>
<span></span>
<div></div>
<script>
$( document.body )
.click(function() {
$( document.body ).append( $( "<div>" ) );
var n = $( "div" ).length;
$( "span" ).text( "There are " + n + " divs." +
"Click to add more.");
})
// Trigger the click to start
.trigger( "click" );
</script>
</body>
</html>
第一个打印是2个div
每点击一下就是多加一个div
网友评论