简化JavaScript

Question

对于我的网站，我写了一小段JavaScript，当点击一个按钮时，它会更新浏览器中的某些元素，但这段代码似乎是冗余且低效的。有没有办法清理它？

$(function () {
    $('#switch').click(function () {
        if ($('#header').text() == 'Sign In') {
            $('#header').text('Sign Up');
            $('#switch').text('Sign In');
            $('#submit').text('Sign Up');
            $('#submit').attr('form', 'sign_up');
        } else {
            $('#header').text('Sign In');
            $('#switch').text('Sign Up');
            $('#submit').text('Sign In');
            $('#submit').attr('form', 'sign_in');
        }
    });
});

Answer 1

我可以看到一个小改进：每次使用它们时都不要查询jQuery对象。相反，将它们存储在变量中：

var $switch = $('#switch')
var $submit = $('#submit')
etc.

然后使用它们而不是多次查询相同的对象。

$switch.click(function() {
        if ($header.text() == 'Sign In') {
            $header.text('Sign Up');
            $switch.text('Sign In');
            $submit.text('Sign Up');
            etc.