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

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

Как проверить: Есть ли подстрока в строке на JavaScript

Чтобы проверить, есть ли подстрока в строке я буду использовать метод indexOf. Предназначение данной функции вернуть вхождение заданного значения. Если функция не найдет совпадение в строке, она вернет -1. Пример:
var str = 'Форум Web Мастера и Компьютерщика';
alert(str.indexOf('Форум')); // 0
alert(str.indexOf('Web'));   // 6
alert(str.indexOf('danfa')); // -1

Известно, что условие (if) воспринимает -1, как true, а 0, как false, следовательно, сделав такую проверку:
var str = 'Форум Web Мастера и Компьютерщика';
if (str.indexOf('Форум')) {
    alert('Подстрока найдена!');
}
else {
    alert('Подстрока не найдена.');
}

Мы получим сообщение: "Подстрока не найдена.", так как indexOf вернет 0, а если будем таким же способом проверять наличие подстроки danfa, то скрипт выведет сообщение "Подстрока найдена!". Проверка не правильно отработала в обоих случаях...

Чтобы избежать неверных проверок, к результату функции indexOf мы прибавим единицу (+ 1), тогда все встанет на свои места,...

Как разбить строку в массив на JavaScript

Чтобы разбить строку в массив я буду использовать функцию split. Данная функция для того и была создана, чтобы возвратить новый массив из предоставленной ей строки. Если разделитель не будет указан или совпадение найдено не будет, то функция вернет массив с одним элементом в виде предоставленной строки. Для пример возьмем строку из пяти букв и трех запятых: a, b, c d, f, запятые будем использовать, как разделитель, то есть то что находится между запятыми станет элементом массива. Разделитель необходимо вставить в саму функцию: split(','). У нас должен получиться массив из четырех элементов, три элемента из одной буквы и один из двух:
var str = 'a, b, c d, f';
var arr = str.split(',');

for (var i = 0; i < arr.length; i++) {
    alert(arr[i]);
};

Данный код поочередно выведет на экран четыре сообщения: a b c d f. Мы разбили строку в массив.

Можно задать лимит элементов в массиве, допустим, на выходе получаем массив с четырьмя элементами, а надо получить с тремя. Тут добавляем второй...

Как передать переменную из JavaScript в PHP

В интернете наткнулся на одну статью, где говорилось, как передать переменную с JS в PHP. Автор статьи показывает пример, как это сделать (Внимание: код не верный):
<script type="text/javascript">
<?php $value = ' + value + '; ?>
</script>

Автор гарантирует, что именно так можно передать переменную в PHP. Мне показалось, что я чего то не понял, что возможно автор имел введу, что то другое, но перечитав статью еще раз, понял, что я все правильно понял, что имел введу автор "писанины"!
Ссылаться на эту статью я не буду, называть автора тоже не буду.

Подобные статьи могут завести человека в тупик, так как данная статья рассказывает совершенно о неверном способе передачи переменной с JS в PHP. Меня однажды подобная статья сбила с толку... Если рассуждать логически - PHP работает на стороне сервера и не может быть понятым браузером, а JS выполняется браузером, то есть на компьютере у пользователя и если в браузере будет PHP код, неважно что функция или переменная, он будет принят, как...

Событие onError (JavaScript)

Событие onError - выполняется при возникновении ошибки загрузки картинки или документа в целом.

Пример использования:
<img src="img.png" alt="" onError="alert('Ошибка загрузки картинки.');">

Пример с использованием метода addEventListener:
<img src="img.png" alt="" id="image">

<script type="text/javascript">
var image = document.getElementById('image');

image.addEventListener('error', problem);

function problem() {
    alert('Ошибка загрузки картинки.');
};
</script>
...

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

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

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

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

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

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