Web Мастерская»Блог

Сообщество Web Мастеров. Тут собрано всё, чтобы написать свой первый сайт, запустить его в Интернет и поддерживать его в течении всей его работы.

Добавление контента при помощи JavaScript (Не замена)

Многие задают вопрос, как добавить информацию в блок на JavaScript, при чем в блоке уже имеется какая то информация и надо именно добавить, а не заменить. Если сделать так:
document.getElementById('content').innerHTML = 'Новая информация';

То все, что находится в блоке с id: content будет заменено на Новая информация, то что было до вставке, будет стерто. Сейчас я расскажу, как можно избежать удаления и сделать именно добавление контента.

Наверное, самый простой (займет всего одну строчку) - добавление контента при помощи +, мы просто добавляем знак плюса перед знаком равно (=), вот так:
document.getElementById('content').innerHTML += 'Новая информация';

Теперь текст Новая информация будет добавлен в конец информации в блоке.

Еще один вариант добавления контента при помощи метода appendChild. Предназначение данного метода - добавление узла в указанный ему элемент. Узел добавляется в конец. Делаем так:
var div = document.createElement('div');             //
...

Как добавить новые элементы в массив на JavaScript

Покажу один простой пример, как можно добавить новые элементы в уже существующий массив. Для этого я буду использовать функцию push(). Предназначение данной функции как раз таки добавлять один или несколько элементов в конец массива. Перехожу к примеру работы функции:
var arr = [1, 2, 3]; // Массив: 1, 2, 3
arr.push(4);         // Добавляем один элемент ("4") в конец массива "arr"
arr.push(5, 6);      // Добавляем два элемента ("5", "6") в конец массива "arr"
arr.push(7, 8, 9);   // Добавляем три элемента ("7", "8", "8") в конец массива "arr"

Теперь наш массив arr выглядит так:
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; // Массив: 1, 2, 3, 4, 5, 6, 7, 8, 9

Если надо добавить в массив элементы из другого массива, скажем из arr2 в arr1, то это можно сделать перебором, при помощи цикла for, например. Делаем так:
for (i = 0; i < arr2.length; i++) {
    arr1.push(arr2[i]); // Добавляем один элемент ("i") в конец массива "arr" при каждой итерации
};

После выполнения...

Как удалить элемент массива на JavaScript

Небольшая инструкция, как удалить элемент массива на языке JavaScript. И так, допустим у нас есть массив собранный из трех элементов, все элементы - цифры (1, 2, 3), хотя это не важно, это может быть не только цифры. Массив:
var arr = [1, 2, 3];

Наша задача - удалить значение второго элемента. Второй элемент это единица arr[1], так как массив начинает с ноля.
Удаляем при помощи delete:
var arr = [1, 2, 3];
delete arr[1];

В результате получим такой массив:
[1, undefined, 3]

Получается, что в массиве по прежнему три элемента, но один из них undefined.

Если надо удалить элемент массива полностью, то можно воспользоваться функцией splice. Предназначение данной функции - изменить содержимое массива, путем удаления существующих элементов и|или добавляя новые. Делаем так:
var arr = [1, 2, 3];
arr.splice(1, 1);

Теперь наш массив состоит из двух элементов:
...

JavaScript: Регулярные выражения

Регулярные выражения - средство для поиска и замены в строке. Регулярное выражение состоит из шаблона и необязательных флагов. Регулярное выражение заключается в слеши (в начале и в конце), заключать в кавычки не надо.
Пример регулярного выражения: /^\s*/ - будет искать один пробел в начале строки. Используя это регулярное выражение можно удалить первый пробел в начале строки, вернее заменить его на "ничего":
variable = variable.replace(/^\s*/, '');


Флаги


После закрывающего слеша можно писать флаги, для более гибкого поиска подстроки. В языке JavaScript имеется три флага:
  • g - Искать все совпадения.
  • i - Регистронезависимый поиск.
  • m - Многострочный режим.

Для примера использования флагов, возьму регулярное выражение написанное выше /^\s*/, такой шаблон, как уже было сказано будет искать только один пробел (первое найденное совпадение), остальные пробелы "ему не нужны". Чтобы искать все пробелы в начале строки добавим флаг g: /^\s*/g:
variable = variable.replace(/^\s*/g, '');
...