За последние 24 часа нас посетили 16443 программиста и 1676 роботов. Сейчас ищут 868 программистов ...

Как быстро изучить JavaScript?

Тема в разделе "JavaScript и AJAX", создана пользователем html-программист, 10 май 2012.

  1. html-программист

    html-программист Активный пользователь

    С нами с:
    10 фев 2012
    Сообщения:
    831
    Симпатии:
    4
    Адрес:
    Kiev
    Что почитать? Что посмотреть?
    Стоит ли смотреть видеоуроки ду-вайла/принтэфа ("JavaScript+jQuery для начинающих 2010 .[Евгений Попов] [2010, RUS]")?
     
  2. neok

    neok Активный пользователь

    С нами с:
    5 окт 2009
    Сообщения:
    3
    Симпатии:
    0
    javascript.ru
     
  3. oksana

    oksana Активный пользователь

    С нами с:
    16 мар 2012
    Сообщения:
    221
    Симпатии:
    0
    Попова я смотрела однозначно НЕТ все поверхностно
     
  4. xfreewindx

    xfreewindx Активный пользователь

    С нами с:
    22 фев 2012
    Сообщения:
    55
    Симпатии:
    0
  5. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    гугель почитай.

    ты уже задавайся целями, и под цели ищи решение.
     
  6. html-программист

    html-программист Активный пользователь

    С нами с:
    10 фев 2012
    Сообщения:
    831
    Симпатии:
    4
    Адрес:
    Kiev
    Цель у меня - научиться делать всякие ajax-выебосы. Почитал, про ajax - нифига не понял. Надо изучать JavaScript
     
  7. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    не, брат. так не работает.

    ты берешь что-то конкретное, и его пилишь. и растет скилл. А так - бесполезно. Хоть обчитайся.

    что ты не понял про ajax?
     
  8. html-программист

    html-программист Активный пользователь

    С нами с:
    10 фев 2012
    Сообщения:
    831
    Симпатии:
    4
    Адрес:
    Kiev
    Про ajax я не понял:
    1. куда это запихнуть:
    Код (PHP):
    1. var req;
    2.  
    3. if (window.XMLHttpRequest) req = new XMLHttpRequest(); 
    4. else if (window.ActiveXObject) {
    5.     try {
    6.         req = new ActiveXObject('Msxml2.XMLHTTP');
    7.     } catch (e){}
    8.     try {
    9.     req = new ActiveXObject('Microsoft.XMLHTTP');
    10.     } catch (e){}
    11. }
    12.  
    13. if (req) {
    14.     req.onreadystatechange = function() {
    15.         if (req.readyState == 4 && req.status == 200)  { alert(req.responseText); }        
    16.     };  
    17.     req.open("POST", 'xmlhttp.php', true);
    18.     req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    19.     req.send('param=1&ajax=1');
    20. } 
    21. else alert("Браузер не поддерживает AJAX"); 
    2. и что с этим теперь делать
     
  9. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    братиш, ты попробуй jQuery.post() и jQuery.get() для начала.

    а то что тут в коде творится становится понятным после ознакомления с самой сутью http-запросов.

    чем отличаются пост от гет?
     
  10. html-программист

    html-программист Активный пользователь

    С нами с:
    10 фев 2012
    Сообщения:
    831
    Симпатии:
    4
    Адрес:
    Kiev
    Да нет, нафиг мне тот jQuery сдался

    Добавлено спустя 3 минуты 5 секунд:
    1. размером: POST - 8кб, GET - 255 символов
    2. способом передачи: POST - в теле запроса, GET - в адресной строке браузера
    3. кэш: POST-запросы не кешируются
     
  11. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    во ты умный =) делай че говорят!

    умничать будешь когда увидишь что и как ДОЛЖНО работать. тогда уже сделаешь свой молоток, свои гвозди, а пока юзай тулзы из магазина.
    че вот умничать, а? вот нафига по-твоему куча спецов делали этот jQuery и почему его все юзают?

    надо было тебе на проктолога идти
     
  12. html-программист

    html-программист Активный пользователь

    С нами с:
    10 фев 2012
    Сообщения:
    831
    Симпатии:
    4
    Адрес:
    Kiev
    Вот нафига по-твоему все смотрят камедиклаб, хотя это откровенный шлак?

    Чем jQuery лучше Аякса?
     
  13. Ke1eth

    Ke1eth Активный пользователь

    С нами с:
    16 мар 2012
    Сообщения:
    1.073
    Симпатии:
    11
    Адрес:
    заблудилса
    сравни с тем, что у тебя и вот тоже самое на jQuery :)
    Код (PHP):
    1. $.ajax({
    2.  url: "xmlhttp.php",
    3.  type: "POST",
    4.  dataType: "xml",
    5.  data: {"param":1, "ajax":1},
    6.  success: function(){},
    7.  error: function(){},
    8. });
    9.   
    jQuery позволяет писать куда меньше лапши

    обернуть в функцию и дернуть ее
     
  14. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    ты вобще соображаешь что ты говоришь? =) она НЕ ЛУЧШЕ аякса. это набор методов для удобной работы с js. он не лучше не хуже. так же как пасатижи не лучше и не хуже молотка, чувак. включайся уже в процесс. хватит летать в облаках.
     
  15. html-программист

    html-программист Активный пользователь

    С нами с:
    10 фев 2012
    Сообщения:
    831
    Симпатии:
    4
    Адрес:
    Kiev
    Как в JavaScript в alert вывести координаты мышки? mouse.x? Или надо EventListener делать, как в ActionScript 3.0?
     
  16. YSandro

    YSandro Старожил

    С нами с:
    7 апр 2011
    Сообщения:
    2.523
    Симпатии:
    2
    гугл поиск + немного ручками поправить =
    Код (PHP):
    1. <script>
    2. var xpos;
    3. var ypos;
    4.  
    5. function mouseMove(event){
    6.     var event=event||window.event;
    7.     ypos=event.pageY||(event.clientY+document.body.scrollTop);//true browser || ie
    8.     xpos=event.pageX||(event.clientX+document.body.scrollLeft);
    9. }
    10. document.onmousemove=mouseMove;
    11. </script>
    На здоровье.
     
  17. html-программист

    html-программист Активный пользователь

    С нами с:
    10 фев 2012
    Сообщения:
    831
    Симпатии:
    4
    Адрес:
    Kiev
    Нашел на википедии код:

    Код (PHP):
    1. <html> 
    2.   <head>
    3.       <title>Дерево Пифагора</title>
    4.       <script type="text/javascript">
    5.         // функция рисует под углом angle линию из указанной точки длиной ln
    6.         function drawLine(x, y, ln, angle) {
    7.           context.moveTo(x, y);
    8.           context.lineTo(Math.round(+ ln * Math.cos(angle)), Math.round(- ln * Math.sin(angle)));
    9.         }
    10.         // Функция рисует дерево
    11.         function drawTree(x, y, ln, minLn, angle) {
    12.           if (ln > minLn) {
    13.               ln = ln * 0.75;
    14.               drawLine(x, y, ln, angle);
    15.               x = Math.round(+ ln * Math.cos(angle));
    16.               y = Math.round(- ln * Math.sin(angle));
    17.               drawTree(x, y, ln, minLn, angle + Math.PI/4);
    18.               drawTree(x, y, ln, minLn, angle - Math.PI/6);
    19.               // если поставить угол Math.PI/4 , то выйдет классическое дерево
    20.           }
    21.         }
    22.         // Инициализация переменных
    23.         function init() {
    24.           var canvas = document.getElementById("tree");
    25.           context = canvas.getContext("2d");
    26.           canvas.width = 480; // Ширина холста
    27.           canvas.height = 320; // высота холста
    28.           var x = canvas.width / 2;
    29.           var y = canvas.height;
    30.           var ln = 120; // начальная длина линии
    31.           var minLn = 4; // минимальная длина до которой рисуются линии
    32.           context.fillStyle = "#ddf"; // цвет фона
    33.           context.strokeStyle = "#020"; //цвет линий
    34.           context.fillRect(0, 0, canvas.width, canvas.height);
    35.           context.lineWidth = 2; // ширина линий
    36.           context.beginPath();
    37.           drawTree(x, y, ln, minLn, Math.PI / 2);
    38.           context.stroke();
    39.         }
    40.       </script>
    41.   </head>
    42.   <body onload="init();">
    43.     <canvas id="tree"></canvas>
    44.   </body> 
    45. </html>
    Это практически один-в-один ActionScript, который я изучал в прошлом году. Те-же Math.cos, Math.round, moveTo, lineTo

    Только в JavaScript как-то аккуратнее смотрится

    Код (PHP):
    1. <!DOCTYPE HTML>
    2. <html>
    3.     <head>
    4.         <script>
    5.             function droveLines(canvas, x, y){
    6.                 var context = canvas.getContext('2d');
    7.                 context.lineTo(x,y);
    8.                 context.stroke();
    9.             }
    10.             
    11.             function getMousePos(canvas, evt){
    12.                 var obj = canvas;
    13.                 var top = 0;
    14.                 var left = 0;
    15.                 while (obj && obj.tagName != 'BODY') {
    16.                     top += obj.offsetTop;
    17.                     left += obj.offsetLeft;
    18.                     obj = obj.offsetParent;
    19.                 }
    20.              
    21.                 var mouseX = evt.clientX - left + window.pageXOffset;
    22.                 var mouseY = evt.clientY - top + window.pageYOffset;
    23.                 return {
    24.                     x: mouseX,
    25.                     y: mouseY
    26.                 };
    27.             }
    28.             
    29.             window.onload = function(){
    30.             var canvas = document.getElementById('myCanvas');
    31.             var context = canvas.getContext('2d');
    32.             canvas.width = 1024; // Ширина холста
    33.             canvas.height = 768; // высота холста
    34.             canvas.addEventListener('mousemove', function(evt){
    35.                     var mousePos = getMousePos(canvas, evt);
    36.                     droveLines(canvas, mousePos.x, mousePos.y);
    37.                 }, false);
    38.             };
    39.         </script>
    40.     </head>
    41.     <body onmousedown="return false;">
    42.         <canvas id="myCanvas">
    43.         </canvas>
    44.     </body>
    45. </html>