javascript nhận con theo id

Question

<div onclick="test(this)"> 
    Test 
    <div id="child">child</div> 
</div> 

Tôi muốn thay đổi kiểu div của con khi div cha được nhấp. Làm thế nào để tôi tham khảo nó? Tôi muốn có thể tham chiếu nó theo ID dưới dạng html trong div cha có thể thay đổi và đứa trẻ sẽ không phải là đứa con đầu tiên, v.v.

function test(el){ 
    el.childNode["child"].style.display = "none"; 
} 

Điều gì đó như vậy, nơi tôi có thể tham chiếu đến trẻ nút theo id và đặt kiểu của nó.

Cảm ơn.

EDIT: Điểm được chụp bằng ID cần phải là duy nhất. Vì vậy, hãy để tôi sửa lại câu hỏi của tôi một chút. Tôi ghét phải tạo ID duy nhất cho mọi phần tử được thêm vào trang. Div cha được thêm tự động. (giống như một hệ thống ghi chú trang). Và sau đó có div con này. Tôi muốn có thể làm một cái gì đó như thế này: el.getElementsByName ("tùy chọn"). Item (0) .style.display = "block";

Nếu tôi thay thế el bằng tài liệu, nó hoạt động tốt, nhưng nó không phải mọi div con "tùy chọn" trên trang. Trong khi đó, tôi muốn có thể nhấp vào div cha, và có div con làm điều gì đó (như đi đi ví dụ).

Nếu tôi phải tự động tạo một triệu ID div (phóng đại), tôi sẽ, nhưng tôi không muốn. Bất kỳ ý tưởng?

Answer 1

Trong trình duyệt hiện đại (IE8, Firefox, Chrome, Opera, Safari), bạn có thể sử dụng querySelector():

function test(el){ 
    el.querySelector("#child").style.display = "none"; 
} 

Đối với các trình duyệt cũ (< = IE7), bạn sẽ phải sử dụng một số loại thư viện, chẳng hạn như Sizzle hoặc một khuôn khổ, chẳng hạn như jQuery, để làm việc với bộ chọn.

Như đã đề cập, ID được cho là duy nhất trong tài liệu, do đó, dễ nhất là chỉ sử dụng document.getElementById("child").

Answer 2

document.getElementById('child') sẽ trả lại cho bạn phần tử chính xác - hãy nhớ rằng id cần phải là duy nhất trên một tài liệu để làm cho nó hợp lệ.

chỉnh sửa: xem this page - id PHẢI là duy nhất.

chỉnh sửa chỉnh sửa: cách thay thế để giải quyết vấn đề:.

<div onclick="test('child1')"> 
    Test 
    <div id="child1">child</div> 
</div> 

sau đó bạn chỉ cần kiểm tra() để tìm kiếm các phần tử bằng cách id mà bạn thông qua vào

Answer 3

Nếu đứa trẻ sẽ luôn luôn là một từ khóa cụ thể thì bạn có thể làm điều đó như thế này

function test(el) 
{ 
var children = el.getElementsByTagName('div');// any tag could be used here.. 

    for(var i = 0; i< children.length;i++) 
    { 
    if (children[i].getAttribute('id') == 'child') // any attribute could be used here 
    { 
    // do what ever you want with the element.. 
    // children[i] holds the element at the moment.. 

    } 
    } 
} 

Answer 4

này hoạt động tốt:

function test(el){ 
    el.childNodes.item("child").style.display = "none"; 
} 

Nếu đối số mặt hàng() chức năng là một số nguyên, hàm sẽ coi nó là một chỉ mục. Nếu đối số là một chuỗi, thì hàm sẽ tìm kiếm tên hoặc ID của phần tử.