Мой первый JavaScript. Любые ошибки?

Question

Доброе воскресное утро!

После прокрутки с помощью JavaScript в этот уик-энд я, наконец, написал свой первый сценарий. Это генератор всплывающей подсказки. Он отлично работает в FF 3 + 3.5, IE 6 + 7, Safari 4, Chrome 2 + 3 и Opera 9 + 10.

Прежде чем вводить мой новый код в производство, я подумал, что спрошу, видите ли вы какие-либо вопиющие проблемы - или, может быть, это прекрасно, как есть? (Lol)

JSLint.com отчеты:

Error: 

Problem at line 10 character 15: 'e' is already defined. 

    var e = window.event; 

Implied global: window 10, document 19,20,22,24,33,35,41,43,49,55 

Вот мой код (извинения заранее, если вам не нравится мой стиль кода):

function getmouseposition(e) 
{ 
    var offx = 22; 
    var offy = 14; 
    var posx = 0; 
    var posy = 0; 

    if (!e) 
    { 
     var e = window.event; 
    } 
    if (e.pageX || e.pageY) 
    { 
     posx = e.pageX; 
     posy = e.pageY; 
    } 
    else if (e.clientX || e.clientY) 
    { 
     posx = e.clientX 
       + document.body.scrollLeft 
       + document.documentElement.scrollLeft; 
     posy = e.clientY 
       + document.body.scrollTop 
       + document.documentElement.scrollTop; 
    } 
    if (document.getElementById) 
    { 
     var tooltip = document.getElementById('tooltip'); 

     tooltip.style.left = (posx + offx) + 'px'; 
     tooltip.style.top = (posy + offy) + 'px'; 
    } 
} 

function tooltip_on(text) 
{ 
    if(!document.getElementById('tooltip')) 
    { 
     var span = document.createElement('span'); 

     span.id = 'tooltip'; 
     span.style.display = 'none'; 
     span.innerHTML = ' '; 

     document.body.appendChild(span); 
    } 
    var tooltip = document.getElementById('tooltip'); 

    tooltip.innerHTML = text; 
    tooltip.style.display = 'block'; 
    tooltip.style.position = 'absolute'; 

    document.onmouseover = getmouseposition; 
    // document.onmousemove = getmouseposition; 
} 

function tooltip_off() 
{ 
    document.getElementById('tooltip').style.display = 'none'; 
} 

EDIT:

Мне также интересно, что говорит эта строка (в терминах непрофессионала) в getmouseposition function:

if (document.getElementById) 

Answer 1

Эта ошибка jslint означает, что переменная e уже определена в рамках функции getmouseposition благодаря наличию аргумента указанной функции. Нет необходимости обновлять его, поэтому просто удалите var с этой строки.

Во-вторых, явно доступные свойства объектов window и document довольно стандартны. Я бы не изменил эту часть вашего кода. Не знаю, почему jslint даже упоминает эти строки.

Очень придирчивые полиции стиля будет жалующиеся пространствами только в скобках:

// Most do this: 
function myFunction(param){ 
    // Statement 1 
    // Statement 2 
    // Statement 3 
} 

// Not this 
function myFunction(param) 
{ 
    // Statement 1 
    // Statement 2 
    // Statement 3 
} 

И очень очень придирчивых Dorks стиля скажут вам использовать одну декларацию уага в верхней части вашей функции:

// Do this 
function getmouseposition(e){ 
    var offx = 22, 
     offy = 14, 
     posx = 0, 
     posy = 0; 


// Not this 
function getmouseposition(e) 
{ 
    var offx = 22; 
    var offy = 14; 
    var posx = 0; 
    var posy = 0; 

Наконец, большинство стилей сознательных JavaScript программисты будут использовать ГорбатыйРегистр для функций, так getMousePosition вместо getmouseposition

Мое мнение таково, что, помимо удаления объявления var, как я предложил в верхней части, ваш код вполне читабельный и достойный стиль, если вы придерживаетесь формата последовательно.

Answer 2

для ошибки: поскольку e является аргументом вашей функции, он уже существует, поэтому вам не нужно объявлять его, просто присвойте ему значение, если оно равно null или undefined.

Просто удалите «var» часть соответствующей линии:

if (!e) e = window.event; 

Answer 3

Я бы порекомендовал вам следовать имя функции конвенции. Это облегчает жизнь тем, кто будет поддерживать ваш код.

function myMethodName(myParam) { 
    // Code 
} 

Answer 4

Да. Всегда есть ошибки, даже если их никто не видит.

Однако в данном конкретном случае отчет, который вы дали, является правильным. Где у вас есть:

var e = window.event; 

, которая создает переменную новыйe, не заменяя параметр e вы уже определили. Измените его на:

e = window.event; 

Answer 5

Вы «е» в качестве параметра вашей функции, а также delcared через «вар е =» внутри вашей функции. Когда параметр передается вашей функции, он уже существует как это имя, и объявление переменной с тем же именем приведет к ошибке. Я бы изменил либо имя объявленной переменной, либо имя параметра, либо назначил его правильно, если это так.

Answer 6

Чтобы решить проблему JSLint, связанную с «подразумеваемым глобальным ... документом», проверьте вариант браузера. Синтаксис выглядит хорошо, за исключением того, что я попытаюсь объявить все ваши переменные, используя одну команду var и список, разделенный запятыми, в верхней части вашей функции. Это немного более эффективно и проще в обслуживании/чтении.

У вас все хорошо для вашей первой попытки, и я надеюсь, что это сработает для вас.

Answer 7

В ответ на ваше редактирование, если при проверке, доступна ли функция getElementById, в настоящее время можно с уверенностью предположить, что эта функция доступна.

Вместо проверки функции, вы можете проверить, если элемент был найден:

var tooltip = document.getElementById('tooltip'); 

if (tooltip) { 
    tooltip.style.left = (posx + offx) + 'px'; 
    tooltip.style.top = (posy + offy) + 'px'; 
} 

Ваш getmouseposition функцию, может быть упрощена:

function getmouseposition(e) { 
    var offx = 22, 
     offy = 14, 
     posx = 0, 
     posy = 0, tooltip; 

    e = e || window.event; 
    posx = e.pageX || (e.clientX 
        + document.body.scrollLeft 
        + document.documentElement.scrollLeft); 

    posy = e.pageY || (e.clientY 
        + document.body.scrollTop 
        + document.documentElement.scrollTop); 

    if (tooltip = document.getElementById('tooltip')) { 
    tooltip.style.left = (posx + offx) + 'px'; 
    tooltip.style.top = (posy + offy) + 'px'; 
    } 
} 

Answer 8

if (document.getElementById)

Эта проверка чтобы определить, определена ли функция getElementById для объекта документа для используемого браузера. Если пользователь использует браузер, который не поддерживает эту функцию, вы не хотите получать ошибку в браузере, а обрабатываете дело.