svg實現繪制路徑動畫

1，首先用svg繪制一條path路徑，然后進行如下操作
　　ps: 下面是svg中兩個屬性及值的意義
　　　　stroke-dasharray是讓你指定畫出的線段每段的長度，第二個值是各段之間空隙的長度。
　　　　stroke-dashoffset是讓你指定每個小段的起始偏移量。
　　var path = document.querySelector('.squiggle-animated path');
　　var length = path.getTotalLength();
　　// 清除之前的動作
　　path.style.transition = path.style.WebkitTransition = 'none';
　　// 設置起始點
　　path.style.strokeDasharray = length + ' ' + length;
　　path.style.strokeDashoffset = length;
　　// 獲取一個區域，獲取相關的樣式，讓瀏覽器尋找一個起始點。
　　path.getBoundingClientRect();
　　// 定義動作
　　path.style.transition = path.style.WebkitTransition =
　　  'stroke-dashoffset 2s ease-in-out';
　　// Go!
　　path.style.strokeDashoffset = '0';