diff --git a/packages/date-picker/src/basic/time-spinner.vue b/packages/date-picker/src/basic/time-spinner.vue
index 741459452..c2152a6f3 100644
--- a/packages/date-picker/src/basic/time-spinner.vue
+++ b/packages/date-picker/src/basic/time-spinner.vue
@@ -87,7 +87,7 @@
         if (!(newVal >= 0 && newVal <= 23)) {
           this.hoursPrivate = oldVal;
         }
-        this.hourElm.scrollTop = Math.max(0, (this.hoursPrivate - 2.5) * 32 + 80);
+        this.hourEl.scrollTop = Math.max(0, (this.hoursPrivate - 2.5) * 32 + 80);
         this.$emit('change', { hours: newVal });
       },
 
@@ -95,7 +95,7 @@
         if (!(newVal >= 0 && newVal <= 59)) {
           this.minutesPrivate = oldVal;
         }
-        this.minuteElm.scrollTop = Math.max(0, (this.minutesPrivate - 2.5) * 32 + 80);
+        this.minuteEl.scrollTop = Math.max(0, (this.minutesPrivate - 2.5) * 32 + 80);
         this.$emit('change', { minutes: newVal });
       },
 
@@ -103,7 +103,7 @@
         if (!(newVal >= 0 && newVal <= 59)) {
           this.secondsPrivate = oldVal;
         }
-        this.secondElm.scrollTop = Math.max(0, (this.secondsPrivate - 2.5) * 32 + 80);
+        this.secondEl.scrollTop = Math.max(0, (this.secondsPrivate - 2.5) * 32 + 80);
         this.$emit('change', { seconds: newVal });
       }
     },
@@ -113,15 +113,15 @@
         return getRangeHours(this.selectableRange);
       },
 
-      hourElm() {
+      hourEl() {
         return this.$refs.hour.wrap;
       },
 
-      minuteElm() {
+      minuteEl() {
         return this.$refs.minute.wrap;
       },
 
-      secondElm() {
+      secondEl() {
         return this.$refs.second.wrap;
       }
     },
@@ -164,9 +164,9 @@
       },
 
       ajustScrollTop() {
-        this.hourElm.scrollTop = Math.max(0, (this.hours - 2.5) * 32 + 80);
-        this.minuteElm.scrollTop = Math.max(0, (this.minutes - 2.5) * 32 + 80);
-        this.secondElm.scrollTop = Math.max(0, (this.seconds - 2.5) * 32 + 80);
+        this.hourEl.scrollTop = Math.max(0, (this.hours - 2.5) * 32 + 80);
+        this.minuteEl.scrollTop = Math.max(0, (this.minutes - 2.5) * 32 + 80);
+        this.secondEl.scrollTop = Math.max(0, (this.seconds - 2.5) * 32 + 80);
       }
     }
   };
diff --git a/test/unit/specs/time-picker.spec.js b/test/unit/specs/time-picker.spec.js
index 9fa8127cb..3b553029d 100644
--- a/test/unit/specs/time-picker.spec.js
+++ b/test/unit/specs/time-picker.spec.js
@@ -58,23 +58,23 @@ describe('TimePicker', () => {
 
     Vue.nextTick(_ => {
       const list = vm.picker.$el.querySelectorAll('.el-time-spinner__list');
-      const hoursElm = list[0];
-      const minutesElm = list[1];
-      const secondsElm = list[2];
-      const hourElm = hoursElm.querySelectorAll('.el-time-spinner__item')[4];
-      const minuteElm = minutesElm.querySelectorAll('.el-time-spinner__item')[36];
-      const secondElm = secondsElm.querySelectorAll('.el-time-spinner__item')[20];
+      const hoursEl = list[0];
+      const minutesEl = list[1];
+      const secondsEl = list[2];
+      const hourEl = hoursEl.querySelectorAll('.el-time-spinner__item')[4];
+      const minuteEl = minutesEl.querySelectorAll('.el-time-spinner__item')[36];
+      const secondEl = secondsEl.querySelectorAll('.el-time-spinner__item')[20];
 
-      hourElm.click();
-      minuteElm.click();
-      secondElm.click();
+      hourEl.click();
+      minuteEl.click();
+      secondEl.click();
 
       Vue.nextTick(_ => {
         const date = vm.picker.currentDate;
 
-        expect(hourElm.classList.contains('active')).to.true;
-        expect(minuteElm.classList.contains('active')).to.true;
-        expect(secondElm.classList.contains('active')).to.true;
+        expect(hourEl.classList.contains('active')).to.true;
+        expect(minuteEl.classList.contains('active')).to.true;
+        expect(secondEl.classList.contains('active')).to.true;
         expect(date.getHours()).to.equal(4);
         expect(date.getMinutes()).to.equal(36);
         expect(date.getSeconds()).to.equal(20);
@@ -165,12 +165,12 @@ describe('TimePicker', () => {
 
     setTimeout(_ => {
       const list = vm.picker.$el.querySelectorAll('.el-time-spinner__list');
-      const hoursElm = list[0];
+      const hoursEl = list[0];
       const disabledHours = [].slice
-        .call(hoursElm.querySelectorAll('.disabled'))
+        .call(hoursEl.querySelectorAll('.disabled'))
         .map(node => Number(node.textContent));
 
-      hoursElm.querySelectorAll('.disabled')[0].click();
+      hoursEl.querySelectorAll('.disabled')[0].click();
       expect(disabledHours).to.not.include.members([18, 19, 20]);
       destroyVM(vm);
       done();