- PVSM.RU - https://www.pvsm.ru -
За последние 2 года я написал два средних расширения для Chrome, и решил вынести для новичков некоторое количество хороших велосипедов, которые очень часто могут пригодиться при использовании jQuery.
Думаю каждый может поделиться своим опытом и выложить запомнившиеся для него куски кода.
В Хроме запрещены любые попытки вставки скриптов в страницу, а этот способ поможет добавить файл скрипта. Работает только с локальными скриптами, для удаленной загрузки скриптов требуется специально разрешить это в manifest и https, о чем уже ранее писали [1].
var load_script = function () {
var script= document.createElement('script');
script.async= 'async';
script.src= 'js/script_name.js';
document.head.appendChild(script);
}
Это мне понадобилось при написании авторизации на популярном торрент клиенте uTorrent. Так как в последних версиях запретили использовать авторизацию через url в виде логин: пароль@урл, это обходится просто, за одно написал как прервать ajax запрос и обрабатывать ошибки:
//Прервать ajax запрос
if (xhr != null)
xhr.abort();
var xhr = $.ajax({
type: "GET",
url: "http://url/",
beforeSend: function(xhr) {
var header = "Basic " + window.btoa(username + ":" + userpassword);
xhr.setRequestHeader("Authorization", header);
},
success: function(data, textStatus, xhr){
//пришедший контент data
console.log(data)
},
statusCode: {
400: function() {
//какое то действие ..
},
401: function() {
//какое то действие ..
}
//любая другая ошибка
},
error:function (xhr, ajaxOptions, thrownError){
//код ошибки xhr.status
console.log(xhr.status);
//описание ошибки thrownError
console.log(thrownError);
}
});
Велосипед определяет что произошел переход по какому то якорю. Это очень нужно, например при написании приложения в хроме, когда все происходит на одной странице.
//Действие которое произойдет после полной загрузки страницы
$(window).load(function () {
//какое то действие c document.URL
});
//Отслеживает изменение в адресной строке и вызывает $(window).load();
var _location_hash = location.hash;
$(window).on('hashchange', function() {
if (location.hash != _location_hash)
{
_location_hash = location.hash;
$(window).trigger('load');
}
});
Что бы форма не отправляла запрос или ссылка не переходила по url, можно в конце функции написать return false. Но есть и более удобный метод.
$('form').submit(function (event) {
event.preventDefault();
//какое то действие
});
Для тех кто возможно не знает как округлять дробные числа.
var val = 123.3243389;
val = val.toFixed(3);
console.log(val); //123.324
Простой пример простого действия, используя regexp.
var str = 'Мама мыла раму'
var r = (/Мама/).test(str); //true
console.log(r);
Хороший пример практичности regexp.
Не забывайте параметры
var text = 'Мама мыла раму';
var keywords = 'мама раму';
keywords = keywords.split(" ");
text = text.replace(new RegExp('('+keywords.join('|')+')',"ig"),"<b>$1</b>");
console.log(text);
Простой пример сортировки не обычного массива.
var arr = [
{
text : 'второй',
val : 1
},
{
text : 'первый',
val : 2
}
];
var order = function (a,b) {
if (a.val > b.val)
return 1;
if (a.val == b.val)
return 0;
return -1;
}
arr.sort(order);
console.log(arr);
Вообще по мере написания больших jQuery приложений находишь много разных отличных решений.
Практикуйтесь, пишите качественный код и спасибо что уделили время статье.
Автор: Anton9121
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/javascript/13922
Ссылки в тексте:
[1] ранее писали: http://habrahabr.ru/post/149948/
Нажмите здесь для печати.