Hướng dẫn javascript get parent width - javascript lấy chiều rộng mẹ

Tôi có mã HTML như thế này -HTML code like this -

Tôi phải tìm chiều rộng của phần tử cha có loại ID.typehead.

Vì vậy, trong trường hợp này, tôi phải tìm chiều rộng của div có ví dụ loại BS.bs-example.

Tôi không thể sử dụng ID ở Div trên để tôi có thể có chiều rộng của phần tử bằng ID vì tôi muốn có một mã có thể sử dụng lại vì nó nên được sử dụng nhiều nơi trong trang.ID in the upper div so that I can have the width of the element by ID because I want a re-usable code because it should be used many places in the page.

Những gì tôi đã làm là -

function myFunction()
{
    var x = document.getElementById("myLI").parentNode.parentElement.width;
    document.getElementById("demo").innerHTML = x;
}

Nhưng nó không hoạt động.

Benmorel

32.9K48 Huy hiệu vàng173 Huy hiệu bạc 306 Huy hiệu đồng48 gold badges173 silver badges306 bronze badges

hỏi ngày 31 tháng 1 năm 2015 lúc 23:10Jan 31, 2015 at 23:10

Abrar Jahinabrar JahinAbrar Jahin

Huy hiệu vàng 13,5K2323 gold badges108 silver badges154 bronze badges

3

Bạn có thể dùng

function parentWidth(elem) {
    return elem.parentElement.clientWidth;
}
parentWidth(document.getElementById('typehead'));

Lưu ý rằng nó sẽ ném nếu bạn gọi nó với đối số document.documentElement. Nếu bạn muốn nó trả lại undefined thay vì ném, hãy sử dụng parentNode thay vì

function myFunction()
{
    var x = document.getElementById("myLI").parentNode.parentElement.width;
    document.getElementById("demo").innerHTML = x;
}

Đã trả lời ngày 31 tháng 1 năm 2015 lúc 23:17Jan 31, 2015 at 23:17

var x = $("#typehead").parent().width();

Đã trả lời ngày 31 tháng 1 năm 2015 lúc 23:17Jan 31, 2015 at 23:17

Balaji Viswanathbalaji ViswanathBalaji Viswanath

1.6741 Huy hiệu vàng12 Huy hiệu bạc19 Huy hiệu đồng1 gold badge12 silver badges19 bronze badges

1

Bạn có thể sử dụng thuộc tính

function myFunction()
{
    var x = document.getElementById("myLI").parentNode.parentElement.width;
    document.getElementById("demo").innerHTML = x;
}

function myFunction() {
    var x = document.getElementById("myLI").parentNode.parentElement.clientWidth;
    document.getElementById("demo").innerHTML = x;
}

Cập nhật bởi người dùng Orion (cảm ơn) từ các bình luận đến bài đăng này:

Lưu ý Điều này sẽ truy xuất

function myFunction()
{
    var x = document.getElementById("myLI").parentNode.parentElement.width;
    document.getElementById("demo").innerHTML = x;
}

2 được sử dụng trong thuộc tính nội dung

function myFunction()
{
    var x = document.getElementById("myLI").parentNode.parentElement.width;
    document.getElementById("demo").innerHTML = x;
}

3, có thể không giống như tính toán

function myFunction()
{
    var x = document.getElementById("myLI").parentNode.parentElement.width;
    document.getElementById("demo").innerHTML = x;
}

2 được tính toán

Đã trả lời ngày 31 tháng 1 năm 2015 lúc 23:13Jan 31, 2015 at 23:13

1

Nếu bạn muốn một hàm chung, bạn có thể sử dụng Pass phần tử để kiểm tra làm tham số và sử dụng jQuery

function myFunction()
{
    var x = document.getElementById("myLI").parentNode.parentElement.width;
    document.getElementById("demo").innerHTML = x;
}

function myFunction()
{
    var x = document.getElementById("myLI").parentNode.parentElement.width;
    document.getElementById("demo").innerHTML = x;
}

Code:

function myFunction($el) {
    return $el.closest('div.bs-example').width();
}

Bản demo: http://jsfiddle.net/f07uanoh/

Đã trả lời ngày 31 tháng 1 năm 2015 lúc 23:22Jan 31, 2015 at 23:22

Irvin Domininirvin DomininIrvin Dominin

30.7k9 Huy hiệu vàng80 Huy hiệu bạc 109 Huy hiệu đồng9 gold badges80 silver badges109 bronze badges

Dưới đây là một ví dụ gọn gàng hơn bằng cách sử dụng jQuery: http://jsfiddle.net/srfqko8r/3/

    

    


function GetParentDivWidth(selector){
    return $(selector).parent("div").width();
}

$(function(){
   alert(GetParentDivWidth("#child"));
});

Cảnh báo "100"

Đã trả lời ngày 31 tháng 1 năm 2015 lúc 23:18Jan 31, 2015 at 23:18

DhuntdhuntDhunt

1.5449 huy hiệu bạc22 Huy hiệu đồng9 silver badges22 bronze badges