Из данного массива получить список

283

05 мая 2017, 15:47

Скажите почему список не выводиться? Мне нужно из массива получить список и сделать из списка Dropdown.

$(document).ready(function() { 
  var contacts = ['Jenny Hess', 'Elliot Fu', 'Stevie Feliciano', 'Christian', 'Matt']; 
  var ul = document.createElement('ul'); 
  for (elem in contacts) { 
    var li = document.createElement("li"); 
    var a = document.createElement("a"); 
    $("a").appendTo("li"); 
    $("a").attr("href", contacts[elem]); 
    $("a").text(elem); 
    $("li").appendTo("ul"); 
  } 
  $("ul").appendTo("body"); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<!DOCTYPE html> 
<html> 
 
<head> 
  <meta charset="utf-8"> 
</head> 
 
<body> 
    
</body> 
 
</html>

Answer 1

Данные предложения

$("a").appendTo("li");
$("a").attr("href", contacts[elem]);
$("a").text(elem);
$("li").appendTo("ul");

не имеют смысла, так как в начале запуска функции документ еще не содержит элементы с тегами <a> и <li>. Причем вы должны использовать не строковые литералы при указании элемента, к которому хотите подключить новый элемент, а имена переменных, которые ссылаются на вновь созданные элементы.

Скрипт может выглядеть следующим образом

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>Creating a List</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>
        $(function () {
            var contacts = ['Jenny Hess', 'Elliot Fu', 'Stevie Feliciano', 'Christian', 'Matt'];
            var ul = document.createElement("ul");
            for (var item in contacts) {
                var a = document.createElement("a");
                a.href = contacts[item];
                a.innerText = item;
                var li = document.createElement("li");
                li.appendChild(a);
                ul.appendChild(li);
            }
            document.body.appendChild(ul);
        });
    </script>
</head>
<body>
    <h1>Creating a List</h1>
</body>
</html>

И поместите скрипты в заголовок документа.

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Заполнение ссылками отдельных полей

У меня на одной странице очень много ссылок разбитых по категориямШтук 500 их у меня там

302

HTML

Фиксация первой строки если ширина не известна

Добрый день!

313

HTML

Почему не передается изображение в canvas?

Не получается передать image в canvasНе понимаю в чем проблема

280

HTML

Как закрыть меню Bootstrap при нажатии на ссылку?

Доброго времени суток! Имеется меню BootstrapНужен скрипт который будет закрывать меню Bootstrap и возвращать обратный цвет background кнопки до её нажатия...

434