Html last child node

Element: lastElementChild property

The Element.lastElementChild read-only property returns an element’s last child Element , or null if there are no child elements.

Element.lastElementChild includes only element nodes. To get all child nodes, including non-element nodes like text and comment nodes, use Node.lastChild .

Value

Examples

ul id="list"> li>First (1)li> li>Second (2)li> li>Third (3)li> ul> script> const list = document.getElementById("list"); console.log(list.lastElementChild.textContent); // logs "Third (3)" script> 

Specifications

Browser compatibility

BCD tables only load in the browser

See also

Found a content problem with this page?

This page was last modified on Apr 7, 2023 by MDN contributors.

Your blueprint for a better internet.

MDN

Support

Our communities

Developers

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2023 by individual mozilla.org contributors. Content available under a Creative Commons license.

Источник

HTML DOM Element lastChild

Get the text of the last child node of a element:

Description

The lastChild property returns the last child node of a node.

The lastChild property returns returns a node object.

The lastChild property is read-only.

Important!

lastChild returns the list child node: An element node, a text node, or a comment node.

Whitespace between elements are also text nodes.

Alternative:

The lastElementChild property returns the last child element (ignores text and comment nodes).

See Also:

Node Properties

Nodes vs Elements

In the HTML DOM terminology:

Nodes are all nodes (element nodes, text nodes, and comment nodes).

Whitespace between elements are also text nodes.

Elements are only element nodes.

childNodes vs children

childNodes returns child nodes (element nodes, text nodes, and comment nodes).

children returns child elements (not text and comment nodes).

firstChild vs firstElementChild

firstChild returns the first child node (an element node, a text node or a comment node). Whitespace between elements are also text nodes.

firstElementChild returns the first child element (not text and comment nodes).

lastChild vs lastElementChild

lastChild returns the last child node (an element node, a text node or a comment node). Whitespace between elements are also text nodes.

lastElementChild returns the last child element (not text and comment nodes).

Syntax

Return Value

More Examples

This example demonstrates how whitespace may interfare:

Try to get the node name of the last child node of «myDIV»:

However, if you remove the whitespace from the source, there are no #text nodes in «myDIV»:

Browser Support

element.lastChild is a DOM Level 1 (1998) feature.

It is fully supported in all browsers:

Chrome	Edge	Firefox	Safari	Opera	IE
Yes	Yes	Yes	Yes	Yes	9-11

Источник

:last-child

The :last-child CSS pseudo-class represents the last element among a group of sibling elements.

Try it

Syntax

Examples

Basic example

HTML

div> p>This text isn't selected.p> p>This text is selected!p> div> div> p>This text isn't selected.p> h2>This text isn't selected: it's not a `p`.h2> div> 

CSS

p:last-child  color: lime; background-color: black; padding: 5px; > 

Result

Styling a list

HTML

ul> li>Item 1li> li>Item 2li> li> Item 3 ul> li>Item 3.1li> li>Item 3.2li> li>Item 3.3li> ul> li> ul> 

CSS

ul li  color: blue; > ul li:last-child  border: 1px solid red; color: red; > 

Result

Specifications

Browser compatibility

BCD tables only load in the browser

See also

Found a content problem with this page?

This page was last modified on Feb 21, 2023 by MDN contributors.

Your blueprint for a better internet.

MDN

Support

Our communities

Developers

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2023 by individual mozilla.org contributors. Content available under a Creative Commons license.

Источник

CSS :last-child Selector

Specify a background color for the

element that is the last child of its parent:

Definition and Usage

The :last-child selector matches every element that is the last child of its parent.

Tip: p:last-child is equal to p:nth-last-child(1).

Browser Support

The numbers in the table specifies the first browser version that fully supports the selector.

CSS Syntax

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

HTML DOM lastElementChild Property

Get the tag name of the last child of a element:

Get the text of the last child of a element:

Description

The lastElementChild property returns the last child element of an element.

The lastElementChild property is read-only.

See Also:

Nodes vs Elements

In the HTML DOM terminology:

Nodes are all nodes (element nodes, text nodes, and comment nodes).

Whitespace between elements are also text nodes.

Elements are only element nodes.

childNodes vs children

childNodes returns child nodes (element nodes, text nodes, and comment nodes).

children returns child elements (not text and comment nodes).

firstChild vs firstElementChild

firstChild returns the first child node (an element node, a text node or a comment node). Whitespace between elements are also text nodes.

firstElementChild returns the first child element (not text and comment nodes).

lastChild vs lastElementChild

lastChild returns the last child node (an element node, a text node or a comment node). Whitespace between elements are also text nodes.

lastElementChild returns the last child element (not text and comment nodes).

Syntax

Return Value

Browser Support

element.lastElementChild is a DOM Level 3 (2004) feature.

It is fully supported in all modern browsers:

Chrome	Edge	Firefox	Safari	Opera	IE
Yes	Yes	Yes	Yes	Yes	11

Источник