Конкатенация строк в объекте JavaScript

Question

Я уверен, что есть простой ответ на этот вопрос, но я не смог его найти.

Я знаю, как объединить обычную строку в JavaScript, но как бы я сделал это внутри объекта?

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

Я пробовал:

carParks.links = carParks.links + "<li><a href=\"#\">car park</a></li>";

безуспешно.

Любая помощь очень ценится.

Answer 1

Конкатенация строк со свойством объекта такая же, как и все остальное.Теоретически код, который у вас есть, должен работать, пока carParks.links является записываемым свойством .При выполнении конкатенации строк с использованием операторов + или +=, за исключением случаев использования их в качестве арифметических операторов, операнды преобразуются в строки.Например:

var carParks = {};
carParks.links = carParks.links + "Test";
// -> "undefinedTest", because carParks.links was undefined

Если вы получаете сообщение об ошибке, убедитесь, что carParks определено и является объектом JavaScript с доступными для записи свойствами (например, не является частью внешнего интерфейса).Если вы не получили ошибку, убедитесь, что carParks.links не является числом.Если это не поможет, пожалуйста, опубликуйте немного больше окружающего кода, и я сделаю еще один снимок.

Answer 2

Это базовая конкатенация строк, однако, в зависимости от ваших соображений производительности, есть разные способы сделать это;по сути, это сводится либо к использованию операторов конкатенации строк, которые дает язык, либо к соединению массивов.Первый довольно простой, но медленный в старых браузерах, а второй быстрее.

В вашем примере вы просто используете конкатенацию строк.Другой способ - использовать оператор +=:

carParks.links = carParks.links + "<li><a href=\"#\">car park</a></li>";

Подход к соединению с массивом выглядит следующим образом:

var buffer = [];
while(node != null) {
   buffer.push("<li><a href=\"#\">car park</a></li>");
}
carParks.links = buffer.join('');

---

Подход к соединению с массивом производит меньше мусора, ноЯ видел, как он работает медленнее в новых браузерах с большими (более 10000 элементов) списками.

Answer 3

Вы должны создать объект UL и использовать appendChild для него для каждого желаемого LI

Answer 4

если вы генерируете тонны ссылок, возможно попробуйте / w array.join ();

var tmp = [];

for ([iterate over xml]) {
     tmp.push("<li><a href=\"#\">car park</a></li>");
}

carParks.links = tmp.join('');

быстрее, чем повторная строка concat

Или что если вы создадите html documentFragment и браузерсделайте конкат за вас ... Когда DocumentFragment добавлен, к конкретному элементу добавляется только фрагмент dildment cildNodes.И макет рассчитывается один раз, а не как на добавление элемента, и вам не нужно заботиться о времени выполнения конкатов строк ...

var docFrag = document.createDocumentFragment();
for ([iterate over xml]) {
     var current = document.createElement('li');
     current.innerHTML = "<a href=\"#\">car park</a>";
     docFrag.appendChild(current);
}

theElementToAppendMyList.appendChild(docFrag);