$('div.label').click(function() {
var paraWidth = $('div.speech p').outerWidth();
var $switcher = $(this).parent();
alter(paraWidth);
alter($switcher);
var switcherWidth = $switcher.outerWidth();
$switcher.animate({
borderWidth: '5px',
left: paraWidth - switcherWidth,
height: '+=20px'
}, 'slow');
});
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Abraham Lincoln's Gettysburg Address</title>
<link rel="stylesheet" href="04.css" type="text/css" />
<script src="jquery.js"></script>
<script src="4.16.js"></script>
</head>
<body>
<div id="container">
<h2>Abraham Lincoln's Gettysburg Address</h2>
<div id="switcher">
<div class="label">Text Size</div>
<button id="switcher-default">Default</button>
<button id="switcher-large">Bigger</button>
<button id="switcher-small">Smaller</button>
</div>
<div class="speech">
<p>Fourscore and seven years ago our fathers brought forth on this continent a new nation, conceived in liberty, and dedicated to the proposition that all men are created equal.</p>
<p>Now we are engaged in a great civil war, testing whether that nation, or any nation so conceived and so dedicated, can long endure. We are met on a great battlefield of that war. We have come to dedicate a portion of that field as a final resting-place for those who here gave their lives that the nation might live. It is altogether fitting and proper that we should do this. But, in a larger sense, we cannot dedicate, we cannot consecrate, we cannot hallow, this ground.</p>
<a href="#" class="more">read more</a>
<p>The brave men, living and dead, who struggled here have consecrated it, far above our poor power to add or detract. The world will little note, nor long remember, what we say here, but it can never forget what they did here. It is for us the living, rather, to be dedicated here to the unfinished work which they who fought here have thus far so nobly advanced.</p>
<p>It is rather for us to be here dedicated to the great task remaining before us—that from these honored dead we take increased devotion to that cause for which they gave the last full measure of devotion—that we here highly resolve that these dead shall not have died in vain—that this nation, under God, shall have a new birth of freedom and that government of the people, by the people, for the people, shall not perish from the earth.</p>
</div>
</div>
</body>
</html>
自己好好看下jquery的api，this为当前点击的label对象（DOM），不是jquery对象
alter错了，这个是数据库的，js提示用alert
函数内this的值是在函数调用时才确定的，函数的调用方式不同，this也就不同。
func是一个函数
1，当函数直接调用时 func(); 函数内this的值是window对象，（在js严格模式"use strict";下，函数内this的值是null）
2，当把这个函数赋值给一个对象的方法obj.abc = func;
调用obj.abc()时，函数内this的值是obj对象,也就是函数所在的对象。
3，当把这个函数赋值给一个dom元素的事件 document.getElementById("id").onclick= func;
在事件触发时，函数内this的值是触发事件的那个dom元素。
4，当把这个函数作为构造函数使用时 new func();函数内this的值是一个新创建的对象。
5，当函数以 func.call(obj); 或 func.apply(obj); 方式调用时， 函数内this的值是call()或apply()方法的第一个参数。
6，当用 func2 = func.bind(obj); 返回一个新的函数。
不论func2函数用什么方式调用，函数内this的值永远都是bind()方法的第一个参数。
7，如果func是一个箭头函数 (x)=>{} ，箭头函数内没有自己的this。
如果在箭头函数内使用this，访问的是外层函数的this。
注：如果this在函数外（全局环境）使用等同于 1 的情况。