Hướng dẫn get child of child element javascript - lấy con của phần tử con javascript

Question

1

Nội dung chính Show

Nhận phần tử con đầu tiên
Nhận phần tử con cuối cùng
Bản tóm tắt
Làm thế nào để bạn có được một yếu tố của một đứa trẻ?
Làm thế nào để bạn truy cập lớp trẻ em trong javascript?
Làm thế nào để bạn tìm thấy yếu tố của một đứa trẻ từ phần tử cha?
JavaScript trẻ em là gì?

Mới! Lưu câu hỏi hoặc câu trả lời và sắp xếp nội dung yêu thích của bạn. Tìm hiểu thêm.
Learn more.

Làm cách nào tôi có thể đặt HTML của một phần tử

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

3 trong DOM nằm dưới

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

4?

Tôi đã thử một cái gì đó như thế này, nhưng không có gì được viết:

element[i].childNodes[1].children.innerHTML = number;

Hỏi ngày 12 tháng 4 năm 2017 lúc 10:57Apr 12, 2017 at 10:57

4

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

5 là một htmlcollection.

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

6 chỉ áp dụng cho các phần tử HTML. Bạn cần tìm phần tử HTML ở trẻ trước khi sử dụng

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

6.

Không có nhiều ý nghĩa để trộn lẫn việc sử dụng

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

8 và

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

5. Sử dụng cái trước để tương thích hơn trên các trình duyệt, sử dụng phương pháp sau để tiếp cận đơn giản hơn cho phép bạn chỉ xem xét các nút phần tử.

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

Ngoài ra, bạn chỉ có thể sử dụng

0:

var li = document.querySelector("li");
var number = 13;
li.querySelector("a").innerHTML = number;

Đã trả lời ngày 12 tháng 4 năm 2017 lúc 10:59Apr 12, 2017 at 10:59

QuentinentinQuentin

879K121 Huy hiệu vàng1178 Huy hiệu bạc1289 Huy hiệu đồng121 gold badges1178 silver badges1289 bronze badges

2

Tôi khuyên bạn nên sử dụng jQuery (http://jquery.com) và sau đó sử dụng có thể làm đơn giản

$('li > a > span').html('THE INNER HTML HERE');

hoặc

$('li > a').find('span').html('THE INNER HTML HERE');

Bạn có thể sử dụng

1 cho hàm find () để có phần tử đầu tiên

Đã trả lời ngày 12 tháng 4 năm 2017 lúc 11:04Apr 12, 2017 at 11:04

Hướng dẫn get child of child element javascript - lấy con của phần tử con javascript

Dori Aviramdori AviramDori Aviram

2722 Huy hiệu bạc8 Huy hiệu Đồng2 silver badges8 bronze badges

1

Tóm tắt: Trong hướng dẫn này, bạn sẽ học cách có được yếu tố con đầu lòng, yếu tố con cuối cùng và tất cả trẻ em thuộc một yếu tố được chỉ định.: in this tutorial, you will learn how to get the first child element, last child element, and all children of a specified element.

Giả sử rằng bạn có đoạn HTML sau:

html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Get Child Elementstitle>
head>
<body>
  <ul id="menu">
    <li class="first">Homeli>
    <li>Productsli>
    <li class="current">Customer Supportli>
    <li>Careersli>
    <li>Investorsli>
    <li>Newsli>
    <li class="last">About Usli>
  ul>
body>
html>
Code language: HTML, XML (xml)

Nhận phần tử con đầu tiên

Để có được phần tử con đầu tiên của một phần tử được chỉ định, bạn sử dụng thuộc tính

2 của phần tử:

let firstChild = parentElement.firstChild; 



Code language: JavaScript (javascript)

Nếu

3 không có bất kỳ phần tử con nào,

2 trả về

5. Thuộc tính

2 trả về một nút con có thể là bất kỳ loại nút nào như nút phần tử, nút văn bản hoặc nút nhận xét. Tập lệnh sau đây cho thấy đứa con đầu lòng của phần tử

7:

element[i].childNodes[1].children.innerHTML = number;

0

Output:

element[i].childNodes[1].children.innerHTML = number;

1

Cửa sổ giao diện điều khiển hiển thị

8 vì một nút văn bản được chèn để duy trì khoảng trắng giữa các thẻ

9 và

var li = document.querySelector("li");
var number = 13;
li.querySelector("a").innerHTML = number;

0 mở. Khoảng trắng này tạo ra một nút

8.

Lưu ý rằng bất kỳ khoảng trắng nào như một không gian đơn, nhiều không gian, trả về và tab sẽ tạo nút

8. Để xóa nút

8, bạn có thể loại bỏ các khoảng trắng như sau:

element[i].childNodes[1].children.innerHTML = number;

2

Hoặc chỉ để có đứa trẻ đầu tiên chỉ có nút phần tử, bạn có thể sử dụng thuộc tính

var li = document.querySelector("li");
var number = 13;
li.querySelector("a").innerHTML = number;

4:

element[i].childNodes[1].children.innerHTML = number;

3

Mã sau trả về mục danh sách đầu tiên là phần tử con đầu tiên của menu:

element[i].childNodes[1].children.innerHTML = number;

4

Output:

element[i].childNodes[1].children.innerHTML = number;

5

Trong ví dụ này:

Đầu tiên, chọn phần tử
```
  
    
      1
    
  
```
7 bằng cách sử dụng phương thức ____ 46 & nbsp;
Thứ hai, & nbsp; Nhận phần tử con đầu tiên bằng cách sử dụng thuộc tính ________ 44 & NBSP;

Nhận phần tử con cuối cùng

Để có được phần tử con cuối cùng của một nút, bạn sử dụng thuộc tính

var li = document.querySelector("li");
var number = 13;
li.querySelector("a").innerHTML = number;

8:

element[i].childNodes[1].children.innerHTML = number;

6

Trong trường hợp

3 không có bất kỳ yếu tố con nào,

var li = document.querySelector("li");
var number = 13;
li.querySelector("a").innerHTML = number;

8 trả về

5. Tương tự như thuộc tính

2, thuộc tính

var li = document.querySelector("li");
var number = 13;
li.querySelector("a").innerHTML = number;

8 trả về nút phần tử đầu tiên, nút văn bản hoặc nút Nhận xét. Nếu bạn chỉ muốn chọn phần tử con cuối cùng với loại nút phần tử, bạn sẽ sử dụng thuộc tính

4:

element[i].childNodes[1].children.innerHTML = number;

7

Mã sau trả về mục danh sách là phần tử con cuối cùng của menu:

element[i].childNodes[1].children.innerHTML = number;

8

Output:

element[i].childNodes[1].children.innerHTML = number;

9

Để có được

5 trực tiếp các phần tử con của một phần tử được chỉ định, bạn sử dụng thuộc tính

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

8:

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

0

Thuộc tính

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

8 Trả về tất cả các phần tử con với bất kỳ loại nút nào. Để lấy phần tử con chỉ bằng loại nút phần tử, bạn sử dụng thuộc tính

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

5:

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

1

Ví dụ sau chọn tất cả các phần tử con của phần tử với ID

9:

var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;

2

Output:

Bản tóm tắt

```
  
    
      1
    
  
```
2 và
```
var li = document.querySelector("li");
var number = 13;
li.querySelector("a").innerHTML = number;
```
8 Trả về đứa con đầu tiên và cuối cùng của một nút, có thể là bất kỳ loại nút nào bao gồm nút văn bản, nút bình luận và nút phần tử.

var li = document.querySelector("li");
var number = 13;
li.querySelector("a").innerHTML = number;

4 và

4 trả về nút phần tử con đầu tiên và cuối cùng.

```
var li = document.querySelector("li");
var number = 13;
li.children[0].children[0].innerHTML = number;
```
8 trả về trực tiếp
```
  
    
      1
    
  
```
5 của tất cả các nút con thuộc bất kỳ loại nút nào của một nút được chỉ định. Trẻ em trả lại tất cả các nút
```
$('li > a > span').html('THE INNER HTML HERE');
```
6 của một nút được chỉ định.

Hướng dẫn này có hữu ích không?

Làm thế nào để bạn có được một yếu tố của một đứa trẻ?

Để có được phần tử con đầu tiên của một phần tử được chỉ định, bạn sử dụng thuộc tính FirstChild của phần tử:..

Đặt FirstChild = ParentEuity.FirstChild; ....

let nội dung = document.getEuityById ('menu'); Đặt FirstChild = content.firstChild.Nodename; Console.log (FirstChild); ....

#text..

Làm thế nào để bạn truy cập lớp trẻ em trong javascript?

Để có được một yếu tố trẻ em theo lớp:..

Sử dụng tài liệu.phương thức truy vấnSelector () để lấy phần tử cha ..

Gọi phương thức QuerySelector trên phần tử cha mẹ chuyển tên lớp dưới dạng tham số ..

Ví dụ, cha mẹ.Truy vấnSelector ('. Đầu tiên') có được đứa trẻ với lớp trước ..

Làm thế nào để bạn tìm thấy yếu tố của một đứa trẻ từ phần tử cha?

Đối với điều này, có 2 cách để có được yếu tố con: bằng cách sử dụng thuộc tính trẻ em.Bằng cách sử dụng phương pháp QuerySelector ...

Chọn phần tử cha có phần tử con sẽ được chọn ..

Sử dụng .Truy vấnSelector () Phương thức về cha mẹ ..

Sử dụng tên lớp của đứa trẻ để chọn đứa trẻ cụ thể đó ..

JavaScript trẻ em là gì?

Các nút trẻ bao gồm các yếu tố, văn bản và ý kiến.Lưu ý: Nodelist được trực tiếp có nghĩa là nội dung của nó được thay đổi mỗi khi trẻ em mới được thêm hoặc loại bỏ.Các mục trong bộ sưu tập các nút là đối tượng, không phải chuỗi.Để lấy dữ liệu từ các đối tượng nút, hãy sử dụng các thuộc tính của chúng.include elements, text and comments. Note: The NodeList being live means that its content is changed each time new children are added or removed. The items in the collection of nodes are objects, not strings. To get data from node objects, use their properties.

programming javascript JavaScript child element

Hướng dẫn get child of child element javascript - lấy con của phần tử con javascript

Nhận phần tử con đầu tiên

Nhận phần tử con cuối cùng

Bản tóm tắt

Làm thế nào để bạn có được một yếu tố của một đứa trẻ?

Làm thế nào để bạn truy cập lớp trẻ em trong javascript?

Làm thế nào để bạn tìm thấy yếu tố của một đứa trẻ từ phần tử cha?

JavaScript trẻ em là gì?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội