Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

дз7 #3

Open
wants to merge 12 commits into
base: gh-pages
Choose a base branch
from
Open

дз7 #3

wants to merge 12 commits into from

Conversation

Yunnii
Copy link

@Yunnii Yunnii commented Nov 16, 2012

  1. у меня не получилось заставить 8 ie календарик. даже с помощью modernizr и jquery datepicker (

  2. вопрос. как лучше делать

    var $name= $("#title");
    
    $name.on('blur', function($event) {
        var cur = $event.currentTarget;
        validateTitle(cur.value, $('#title_help'));
    });
    

или объединять

   $("#title").on('blur', function($event) {
        var cur = $event.currentTarget;
        validateTitle(cur.value, $('#title_help'));
    });
  1. не нашла jquery аналога createDocumentFragment надеюсь это не критично

А так, вроде бы все

@azproduction
Copy link
Member

1 у меня не получилось заставить 8 ie календарик. даже с помощью modernizr и jquery datepicker (

Календарь это новомодный HTML5 контрол - ничего страшного если в данном проекте его нет.

С дейтпикером все вроде просто http://jqueryui.com/resources/demos/datepicker/default.html

<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>jQuery UI Datepicker - Default functionality</title>

    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />

    <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>

    <script>
    $(function() {
        $( "#datepicker" ).datepicker();
    });
    </script>
</head>
<body>

<p>Date: <input type="text" id="datepicker" /></p>


</body>
</html>

2

Если $("#title") будет использоваться только 1 раз, то объедини. Если много раз - "закэшируй" в переменную. Дело в том, что любая операция с DOM дорогая - поиск (то, что у тебя), вставка, изменение элементов. Их принято минимизировать.

3

Если пользоваться шаблонизаторами, то createDocumentFragment и не нужен, можно сделать так:

var $box = $();

$box = $box.add($('<div/>'));
$box = $box.add($('<div/>'));
$box = $box.add($('<div/>'));

$box.length; // 3

$box.appendTo('body');

filterOption = "all",
sortOption = "without";

$(document.body).on('load', initialise());
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

У тебя тут произойдет следющее: функция initialise() будет вызвана, а результат ее выполнения будет передан в функцию .on() те фактически:

var result = initialise();
$(document.body).on('load', result); // смысла нет

Скорее всего это просто невнимательность :)

Вобще лучше использовать событие DOMContentLoaded вместо onload

$(document).ready(initialise);

или сокращенно

$(initialise);

Разница между DOMContentLoaded и onload в следующем: load срабатывает когда все ресурсы страницы загрузились DOMContentLoaded - когда загрузился только документ. На страницце может быть много картинок и в случае с onload она "оживет" только когда они все загрузяться.

http://stackoverflow.com/questions/3698200/window-onload-vs-document-ready

@Yunnii
Copy link
Author

Yunnii commented Nov 16, 2012

вспомнила еще один вопрос, который хотела задать.
Почти всем элементам можно задать id, по которому его можно найти через $().

С другой стороны, есть например методы такие как find() closest(), которые позволяют найти элемент окольным путем.

И как выбрать между двумя этими способами? второй выбирать, когда необходимо изменять сгенерированный кусок страницы(ну вот как мы события в ul li ), интуитивно или есть какая то особая философия?

(надеюсь я понятно вопрос обьяснила (>->))

@azproduction
Copy link
Member

Все хорошо. Попробуй использовать шалобны http://ejohn.org/blog/javascript-micro-templating/ (http://javascript.ru/unsorted/templating) вместо

$('<div/>').addClass('pewpew');

;-)

@azproduction
Copy link
Member

есть какая то особая философия?

  1. Мы делим страницу на логические части (блоки) блок выбираем напрямую var $block = $('.b-my-block'). Элементы блока выбираем относительно родителя $block.find('.b-my-block__button');. Есть какой-то основной скрипт, который может работать относительно корня и стартует блоки, каждый блок может работать только относительно своего элемента.
  2. Так же стараемся не использовать id а выбираем по уникальному классу или выбираем относительно.

Все это позволяет создавать масштабируемые программы и уменьшает вероятность конфликта.

Уникальный ид не всегда возможен - с тобой в команде может быть разработчик, который сам того не зная создаст конфликт Идшников если элементов много и все они должны иметь уникальный ИД. Своеобразный namespace спасает ситуацию.

<div class="b-block-filter">
    ...
    <button class="b-form-buton">Filter</div>
</div>

<div class="b-add-form">
    ...
    <button class="b-form-buton">Add</div>
</div>
var $form = $('.b-add-form');
$form.find('.b-form-buton'); // ok

$('.b-form-buton'); // 2 elements - conflict!

@Yunnii
Copy link
Author

Yunnii commented Nov 25, 2012

Поправила все, кроме мест где нужны шаблонизаторы, впилю в след домашке ( А вы можете выложить ту мини лекцию по шаблонизаторам?

@azproduction
Copy link
Member

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants