简化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.