javascript - 优化 Javascript 中的函数

Question

我是 javascript 的新手，但已经设法编写了一个有效的 xml 函数:)

我希望有人能告诉我如何优化该功能。目前每个州的天气都有不同的功能，但我希望我能以某种方式简化它。

代码粘贴在这里:http://pastie.org/private/ffuvwgbeenhyo07vqkkcsw

非常感谢任何帮助。谢谢!

编辑:添加两个 XML 提要的代码示例:

函数 1(紫外线):http://pastie.org/private/jc9oxkexypn0cw5yaskiq

函数 2(天气):http://pastie.org/private/pnckz4k4yabgvtdbsjvvrq

Answer 1

$(d).find('location#sydney')

有疑问。 #sydney表示属性值为 sydney 的元素具有架构类型 ID .在 HTML 中，id="..."属性具有模式类型 ID感谢 DOCTYPE。但是这个 XML 文件没有 DOCTYPE，因此它的 id="..."属性没有模式类型 ID .因此 getElementById('sydney')行不通，#sydney作为选择器不应该工作。

它在实践中有效，因为当你使用 find() jQuery 回退到它自己的“Sizzle”JavaScript 选择器匹配器，它只查找 id="..."。属性，就好像它是 HTML 一样。但是 Sizzle 很慢，你不应该依赖这个实现细节。使用显式属性选择器 location[id=sydney]更适合 XML 文档。

var sydneyuv = sydneyuv += '<span>' + uvindex + '</span>' ;

你在这里有一个多余的任务。您使用扩充赋值 +=添加一些东西到 sydneyuv , 然后将结果分配给 sydneyuv再次。

此外，通常最好不要将输入值中的 HTML 字符串拼接在一起。如果uvindex怎么办有 HTML 特殊字符吗？ (它可能不会，但是没有什么可以阻止您正在抓取的网站包括它们。)如果没有 HTML 转义，您将有 HTML 注入(inject)和潜在的 XSS 安全漏洞。总是使用 DOM 风格的方法，比如 text()和 attr()在 jQuery 中，或创建快捷方式:var $sydneyuv= $('<span/>', {text: uvindex}); ，而不是字符串吊索。

I was hoping I could simplify this somehow.

当然。使其成为数据驱动的:

var towns= ['sydney', 'melbourne', 'brisbane', 'perth', 'adelaide', 'darwin'];
var uvlevels= [
    {uvlevel: 2,    risk: 'Low',         curcon: 'You can safely stay outdoors and use an SPF 15 moisturiser.'},
    {uvlevel: 5,    risk: 'Moderate',    curcon: 'Wear protective clothing outdoors and use an SPF 15 or SPF 30 moisturiser.'},
    {uvlevel: 7,    risk: 'High',        curcon: 'Wear protective clothing, limit your time outdoors and use an SPF 30 moisturiser.'},
    {uvlevel: 10,   risk: 'Very high',   curcon: 'Use caution, limit exposure to the sun and use an SPF 30 moisturiser.'},
    {uvlevel: 20,   risk: 'Extreme',     curcon: 'Use extreme caution, avoid exposure to the sun and use an SPF 30 moisturiser.'},
    {uvlevel: null, risk: 'Unavailable', curcon: 'Information is currently unavailable.'}
];

现在您可以用一个循环替换所有这些单独的语句:

$.each(towns, function() {
    var $location= $(d).find('location[id='+this+']');
    var uv= $location.find('index').text();
    var shorttown= this.slice(0, 3);
    $('#uv-'+shortttown).empty().append($('<span/>', {text: uv}));
    $.each(uvlevels, function() {
        if (this.uvlevel===null || uv<=this.uvlevel) {
            $('#risk-'+shorttown).text(this.risk);
            $('#curcon-'+shorttown).text(this.curcon);
            return false;
        }
    });
});

而且无论天气如何，大概都是相似的。

(我会在 HTML 文档 ID 中使用完整的城镇 ID，因此您不需要 shorttown hack。)