Javascript отображаемое имя div

Question

Javascript отображаемое имя div

1

У меня есть контейнер с divs внутри, используя Javascript. Я пытаюсь открыть окно предупреждения для каждого найденного элемента, отображающего "имя" div...

items = document.getElementsByClassName("single_item");

for (i = 0; i < items.length; i++) {
    alert("This is an item - the name is...")
}

<div class="container">
    <div name="item1" class="single_item">
        Item 1
    </div>
    <div name="item2" class="single_item">
        Item 2
    </div>
    <div name="item3" class="single_item">
        Item 3
    </div>
    <div name="item4" class="single_item">
        Item 4
    </div>
</div>

Я застреваю, пытаясь получить доступ к значению имени, у кого есть пример, на который я могу посмотреть?

fightstarr20 04 июнь 2017, в 11:39

Источник

Теги:

javascript

5 ответов

Ещё вопросы

Anders · Answer 1 · 2017-06-04T07-51-00.000Z

items = document.getElementsByClassName("single_item");

for (i = 0; i < items.length; i++) {
    alert("This is an item - the name = " + items[i].getAttribute("name"))
}

<div class="container">
    <div name="item1" class="single_item">
        Item 1
    </div>
    <div name="item2" class="single_item">
        Item 2
    </div>
    <div name="item3" class="single_item">
        Item 3
    </div>
    <div name="item4" class="single_item">
        Item 4
    </div>
</div>

name не является допустимым атрибутом элемента div . Вместо этого следует использовать data-name .

Mr. Alien · Answer 2 · 2017-06-04T07-27-00.000Z

Вы можете использовать .getAttribute() для этого. Кроме того, у вас есть привычка использовать ключевое слово var для ваших переменных, или, если ваш код станет больше, у вас может быть много глобальных переменных.

Кроме того, вы используете атрибут name, который используется для элементов формы, таких как input, поэтому, если вы хотите использовать его для своего div, вы можете использовать пользовательские атрибуты, такие как data-name и соответственно редактировать значение JA getAttribute

var items = document.getElementsByClassName("single_item");

for (i = 0; i < items.length; i++) {
    //using getAttribute to fetch the name attribute value
    alert("This is an item - the name is..." + items[i].getAttribute("name"));
}

<div class="container">
    <div name="item1" class="single_item">
        Item 1
    </div>
    <div name="item2" class="single_item">
        Item 2
    </div>
    <div name="item3" class="single_item">
        Item 3
    </div>
    <div name="item4" class="single_item">
        Item 4
    </div>
</div>

Кроме того, мне просто интересно узнать, почему вы используете alert() что очень раздражает и не рекомендуется. Если вы пытаетесь отлаживать и хотите выводить некоторые результаты, вы всегда можете использовать console.log() который будет печатать результаты на вашей консоли, и в отличие от alert(), это не остановит выполнение вашего JS.

Kashkain · Answer 3 · 2017-06-04T07-25-00.000Z

сделайте это так, с getAttribute

items = document.getElementsByClassName("single_item");

for (i = 0; i < items.length; i++) {
    alert("This is an item - the name is " + items[i].getAttribute("name"));
}

<div class="container">
    <div name="item1" class="single_item">
        Item 1
    </div>
    <div name="item2" class="single_item">
        Item 2
    </div>
    <div name="item3" class="single_item">
        Item 3
    </div>
    <div name="item4" class="single_item">
        Item 4
    </div>
</div>

S.M. Shakil · Answer 4 · 2017-06-04T06-47-00.000Z

Использовать следующий код

for (i = 0; i < items.length; i++) {
    var nameValue = item[i].getAttribute('name');
    alert("This is an item - the name is " + nameValue);
}

Alexios Tsiaparas · Answer 5 · 2017-06-04T08-00-00.000Z

Если по имени вы имеете в виду текст внутри div, тогда это доступно через свойство textContent

alert("This is an item - the name is "+items[i].textContent);