Question

我的代码出了什么问题，我用在线jslint检查了它，并且说在声明之前使用了spell_img？

spell_img = new Image();
spell_img.src = '/images/standard/spellcheck.gif';
spell_img.setAttribute('title',_lang_spellcheck );

function find_text_boxes()
{
    myforms = document.forms;
    for( i=0;i < myforms.length; i++ )
    {
        textareas = myforms[i].getElementsById('textarea');
        for( y=0; y < textareas.length; y++ )
        {
            spelllink = document.createElement('a');
            spelllink.setAttribute('href',"javascript:spellCheck(" + i + ", '" + textareas[y].name + "')");
            spelllink.appendChild( spell_img.cloneNode(true) );
            textareaParent = textareas[y].parentNode;
            textareaParent.insertBefore( spelllink, textareas[y].nextSibling );
        }
    }
}

Answer 1

第1步：声明变量。在JavaScript中，这是使用var完成的。 var将变量范围限定为找到var的范围; JavaScript中的范围（当前）基于函数。

var spell_img = new Image();
spell_img.src = '/images/standard/spellcheck.gif';
spell_img.setAttribute('title',_lang_spellcheck );

function find_text_boxes()
{
    var myforms = document.forms;
    for( var i=0;i < myforms.length; i++ )
    {
        var textareas = myforms[i].getElementsById('textarea');
        for( var y=0; y < textareas.length; y++ )
        {
            var spelllink = document.createElement('a');
            spelllink.setAttribute('href',"javascript:spellCheck(" + i + ", '" + textareas[y].name + "')");
            spelllink.appendChild( spell_img.cloneNode(true) );
            textareaParent = textareas[y].parentNode;
            textareaParent.insertBefore( spelllink, textareas[y].nextSibling );
        }
    }
}

第2步：getElementsById不是存在的东西。它是getElementsByTagName。

var spell_img = new Image();
spell_img.src = '/images/standard/spellcheck.gif';
spell_img.setAttribute('title',_lang_spellcheck );

function find_text_boxes()
{
    var myforms = document.forms;

    for( var i = 0; i < myforms.length; i++ )
    {
        var textareas = myforms[i].getElementsByTagName('textarea');

        for( var y = 0; y < textareas.length; y++ )
        {
            var spelllink = document.createElement('a');
            spelllink.setAttribute('href',"javascript:spellCheck(" + i + ", '" + textareas[y].name + "')");
            spelllink.appendChild( spell_img.cloneNode(true) );
            textareaParent = textareas[y].parentNode;
            textareaParent.insertBefore( spelllink, textareas[y].nextSibling );
        }
    }
}

第3步：等等，你为什么要先获得表格？

var spell_img = new Image();
spell_img.src = '/images/standard/spellcheck.gif';
spell_img.setAttribute('title',_lang_spellcheck );

function find_text_boxes() {
    var textareas = document.getElementsByTagName('textarea');

    for(var i = 0; i < textareas.length; i++) {
        var spelllink = document.createElement('a');
        spelllink.setAttribute('href',"javascript:spellCheck(" + i + ", '" + textareas[y].name + "')");
        spelllink.appendChild( spell_img.cloneNode(true) );
        textareaParent = textareas[y].parentNode;
        textareaParent.insertBefore( spelllink, textareas[y].nextSibling );
    }
}

第4步：javascript: URI不好。内联JavaScript很糟糕。 JavaScript中内联网址中的内联JavaScript？这真的很糟糕，有点像eval和各种各样的东西。创建一个函数并使spellCheck接受一个元素对象，而不是表单索引，yuck。顺便说一下，title是属性和属性（如src）：

var forEach = Array.prototype.forEach;

var spell_img = new Image();
spell_img.src = '/images/standard/spellcheck.gif';
spell_img.title = _lang_spellcheck;

function find_text_boxes() {
    var textareas = document.getElementsByTagName('textarea');

    forEach.call(textareas, function(textarea) {
        var spellLink = document.createElement('a');

        spellLink.href = "#";
        spellLink.addEventListener("click", function(e) {
            e.preventDefault();
            spellCheck(textarea);
        }, false);

        spellLink.appendChild(spell_img.cloneNode(true));

        textarea.parentNode.insertBefore(spelllink, textareas[y].nextSibling);
    });
}

如果您需要与没有shivs的旧IE兼容，那是可行的：

var spell_img = new Image();
spell_img.src = '/images/standard/spellcheck.gif';
spell_img.title = _lang_spellcheck;

function find_text_boxes() {
    var textareas = document.getElementsByTagName('textarea');

    for (var i = 0; i < textareas.length; i++) {
        (function(textarea) {
            var spellLink = document.createElement('a');

            spellLink.href = "#";
            spellLink.onclick = function() {
                spellCheck(textarea);
                return false;
            };

            spellLink.appendChild(spell_img.cloneNode(true));

            textarea.parentNode.insertBefore(spelllink, textareas[y].nextSibling);
        })(textareas[i]);
    });
}

你可以通过一些事件授权将樱桃放在首位。

function addSpellLink(textarea) {
    var link = document.createElement("a");
    link.className = "spell-link";
    link.href = "#";

    link.appendChild(spell_img.cloneNode(true));

    textarea.parentNode.insertBefore(link, textarea.nextSibling);
}

function findTextboxes() {
    Array.prototype.forEach.call(document.getElementsByTagName("textarea"), addSpellLink);
}

document.addEventListener("click", function(e) {
    if (e.target.classList.contains("spell-link")) {
        e.preventDefault();
        spellCheck(e.previousElementSibling);
    }
}, false);

Answer 2

var spell_img = new Image();//place any one of these right at the top of your scope.

或

window.spell_img = new Image();//replace first line

Javascript jslint说spell_img在声明之前使用

2 个答案: