Скрытие элемента <th> с помощью JavaScript

Question

Скрытие элемента <th> с помощью JavaScript

0

Я попытался скрыть некоторый элемент таблицы JavaScript
Для элемента <td> это ОК:

function hide(){  
    var x=document.getElementsByTagName('td');  
    for(var i in x){  
        x[i].style.visibility='hidden';  
    }  
}

Но когда я сделал то же самое с <th> элементами, это не ОК

function hide(){  
    var x=document.getElementsByTagName('th');  
    for(var i in x){  
        x[i].style.visibility='hidden';  
    }  
}

Некоторое тело, пожалуйста, скажите мне, почему? И как я могу справиться?

Здесь мой HTML

<table>  
    <thead>  
        <tr>  
            <th>header 1</th>  
            <th>header 2</th>  
            <th>header 3</th>  
        </tr>  
    </thead>  
    <tbody>  
        <tr>  
            <td>content 1.1</td>  
            <td>content 1.2</td>  
            <td>content 1.3</td>  
        </tr>  
        <tr>  
            <td>content 2.1</td>  
            <td>content 2.2</td>  
            <td>content 2.3</td>  
        </tr>  
    </tbody>

Там странная вещь, когда я это делаю

function hide(){  
    var x=document.getElementsByTagName('td');  
    for(var i in x){  
        x[i].style.visibility='hidden';  
    }  
    var y=document.getElementsByTagName('th');  
    for(var i in y){  
        y[i].style.visibility='hidden';  
    }  
}

Функция работает некорректно, только элементы скрываются, все еще видны.

Но когда я разделяю на две функции, он работает правильно.

Я использую Chrome.
Почему это произошло?

user3098638 22 март 2014, в 09:34

Источник

3

выглядит хорошо здесь. Пожалуйста, оставьте свою HTML-разметку
Dipak Ingole 22 март 2014, в 08:02
1

Вы также можете поделиться соответствующим HTML-кодом? также как вы вызываете функцию hide для <td> и <th> ?
anurupr 22 март 2014, в 08:03
1

По крайней мере, в Chrome есть проблема с этим. Поскольку for будет включать length в некоторой точке, в конце цикла javascript выдаст ошибку.
David 22 март 2014, в 08:04
0

Поместите ваш HTML в скрипку @Pilot's Pilot, он работает нормально: jsfiddle.net/barmar/5fnT8/1
Barmar 22 март 2014, в 08:10
0

@anurupr Я положил на кнопку в две кнопки. Имя функции только для примера.
user3098638 22 март 2014, в 08:11
0

@David Давид Я использую Chrome.
user3098638 22 март 2014, в 08:13

Показать ещё 4 комментария

Теги:

javascript

html

2 ответа

1

как в Бармаре.

$(document).ready(function(){
    var x=document.getElementsByTagName('th');  
    for(var i = 0; i < x.length; i++){  
         x[i].style.display ='none';  
    }   
});

Демо-версия:

http://jsfiddle.net/patelriki13/r5Ua5/

Rikin Patel 22 март 2014, в 05:25

Ещё вопросы

выглядит хорошо здесь. Пожалуйста, оставьте свою HTML-разметку
Вы также можете поделиться соответствующим HTML-кодом? также как вы вызываете функцию hide для <td> и <th> ?
По крайней мере, в Chrome есть проблема с этим. Поскольку for будет включать length в некоторой точке, в конце цикла javascript выдаст ошибку.
Поместите ваш HTML в скрипку @Pilot's Pilot, он работает нормально: jsfiddle.net/barmar/5fnT8/1
@anurupr Я положил на кнопку в две кнопки. Имя функции только для примера.

Barmar · Accepted Answer · 2014-03-22T05-57-00.000Z

Не используйте for-in для итерации над NodeList. Объект NodeList имеет свойства, которые не являются элементами списка. Он получает ошибку, когда i является "length", потому что x["length"] не имеет свойства style.

function hide(){  
    var x=document.getElementsByTagName('th');  
    for(var i = 0; i < x.length; i++){  
        x[i].style.visibility='hidden';  
    }  
}

FIDDLE