Pages

系列文章

2015/02/13

【JQuery應用】substr 與 substring 之間的差異


在JQuery中取字串可以使用substring以及substr這兩個方式來達到目的
可是一樣都是取字串為什麼還要有兩個不一樣的function呢?
今天就讓我們來比較一下兩者之間的差異吧~!
學習資訊
substring以及substr這兩個方法是在JavaScript中就有的方法
在JQuery之中也有而且使用的方式是一樣的喔


首先我們先來設定一個字串「hello world」來做為測試參數
然後分別來看一下substr 與 substring之間抓參數的方式
要注意一下字串的索引值都是從「0」開始的唷
substr抓取字串方式

為了讓大家方便了解所以舉兩個例子方便大家做比較
下述例子分別是指由索引值0以及7開始向後抓取字元直到最後一個字元為止
特別要注意的是空白鍵或是特殊字元都算都會占用一個索引喔
alert("hello world".substr(0));
//此處顯示結果為 hello world
alert("hello world".substr(7));
//此處顯示結果為 orld


而下述這個例子則是指由索引值3開始向後抓取8個字元
"hello world".substr(3,8)
//此處顯示結果為 lo world

substring 抓取字串方式

substring抓取字串一樣有兩種方式
首先是跟substr一樣只有指定一個參數
顯示出來的效果基本上也跟substring一樣沒有差異
alert("hello world".substring(0));
//此處顯示結果為hello world


但是如果是在給予兩個參數的狀況下
substr 與 substring 顯示的結果就不同了
先讓我們來看看以下幾個範例跟顯示結果
alert("hello world".substring(2,6));
//此處顯示結果為llo (有包含一個空格唷)
alert("hello world".substring(0,2));
//此處顯示結果為he
alert("hello world".substring(2,0));
//此處顯示結果為he

透過上述的「"hello world".substring(2,6)」這個例子我們可以發現
它在顯示時會包含起始索引位置的字元但是不會包含結束索引位置的字元
而在「hello world".substring(0,2)」與「hello world".substring(2,0)」的例子中我們可以發現
這兩個例子取出來的值是一樣的,透過這個訊息我們可以知道
substring是透過指定索引位址然後取出兩個索引值之間的字元(不會取出最大(結束)索引位置的值)
所以不管是取(0,2)還是(2,0)所顯示的值都會是一樣的


看完了上述兩個例子不知道大家有沒有了解substr 與 substring 之間的差異了呢?
這邊就稍微做個簡單的總結一下


substr(3,8)是指定起始索引位置,然後從起始的索引位置開始向後抓取指定的位置
是以3為起始位置然後向後抓取8個字元

substring(0,2)是指定任兩個索引位置,然後抓取出這兩個索引之間的值
且不包含最後一個索引位置的值

希望以上的說明能對各位有幫助


6 則留言:

  1. 請問:
    在blogger可以用js讓一些文字個別從上而下滑落嗎? 這些js的code需要自己撰寫嗎?
    謝謝

    回覆刪除
    回覆
    1. 邏輯上來說是可以 不過Code要自己找
      如果要寫應該是只能寫在「編輯HTML」的頁面裡面
      至於你說的特效我是沒有看過但是你可以嘗試以下關鍵字
      「JQuery文字特效」,「JavaScript文字特效」,「CSS3文字特效」等關鍵字
      因為這種功能是非必要性且重複使用性不高 可能不會有專門的function可以套用
      可以找看看有沒有類似的 在自己修改就好

      刪除
  2. 感謝回覆
    我說的特效,比方這個BLOG http://17pasta.blogspot.tw/
    在[首頁] [最新消息]那邊的上面,有英文字和星星一直掉下來
    我查了原始碼,看到一堆JS,但是不知道相關的CODE是在哪兒

    我對JQUERY的深刻印象是LIGHTBOX
    有時候看到JQUERY的CODE會引用某個網址,網址裡面都是一堆CODE
    為什麼會這樣呢? 是要靠該網址所提供的東西才能完成效果嗎?
    這類的網址都是可以讓人隨意使用的嗎?

    回覆刪除
    回覆
    1. 根據該部落格看來 它那個特效試利用HTML的跑馬燈特效做的
      你可以GOOGLE 「marquee html」 這個關鍵字找看看相關操作屬性

      刪除
  3. 請問 CHROME有新版本的時候,會彈出視窗通知,有辦法不要這通知嗎? 謝謝

    回覆刪除
    回覆
    1. http://engmeter.blogspot.tw/2015/03/google-chromechrome.html

      你可以參考這篇教學,我有把操作步驟弄成圖片方便你比照操作了

      刪除