HTML5學(xué)堂（碼匠）：文本操作一直是開(kāi)發(fā)中不可避免的存在，用戶選中的文本內(nèi)容，是否可以進(jìn)行獲取并處理到需要的位置當(dāng)中？如果可以，這樣的操作到底需要使用到哪些方法呢？
本文主要內(nèi)容
1. 目標(biāo)效果展示
2. 涉及的基本屬性知識(shí)
3. 核心功能-選取的相關(guān)知識(shí)
1. 目標(biāo)效果展示
HTML5學(xué)堂（碼匠）- 選中并獲取多行文本框內(nèi)容的效果
如上，主要實(shí)現(xiàn)的是用戶自定義選擇多行文本框中的任何內(nèi)容，然后把獲取的內(nèi)容放到按鈕下的文本中作為內(nèi)容的存放，最后通過(guò)點(diǎn)擊按鈕實(shí)現(xiàn)內(nèi)容的設(shè)置，從而把用戶需要的信息從大量的內(nèi)容文本中獲取出來(lái)。實(shí)現(xiàn)這種文本操作的功能，就必然需要考慮各方面的屬性以及瀏覽器等兼容問(wèn)題，接下來(lái)就一起來(lái)看看吧~~~
2. 涉及的基本屬性知識(shí)
2.1 屬性
是一個(gè)在JS中擁有雙向功能的屬性js獲取表格選中行數(shù)據(jù)，它可以獲取對(duì)象的內(nèi)容，同時(shí)又可以向?qū)ο蟛迦雰?nèi)容。所以在使用JS處理內(nèi)容時(shí)，通常是需要借助標(biāo)簽的屬性，對(duì)標(biāo)簽元素的內(nèi)容進(jìn)行修改。即把內(nèi)容賦值給這個(gè)屬性即可。如下：
HTML5學(xué)堂（碼匠） - 屬性
2.2 字符串方法
字符串方法是JS底層操作中經(jīng)常使用到的一系列方法，本效果中主要是借助了split()方法，這個(gè)方法主要是用來(lái)實(shí)現(xiàn)字符串的切割，得到的是一個(gè)字符串?dāng)?shù)組，其切割的依據(jù)在于方法中的參數(shù)js獲取表格選中行數(shù)據(jù)，參數(shù)標(biāo)記是什么，那就按照這個(gè)標(biāo)記進(jìn)行切割。如下是依據(jù)轉(zhuǎn)義字符“\n”的做字符串切割的書寫：
var arr = ..split('\n');
3. 核心功能-選取的相關(guān)知識(shí)
本效果是對(duì)文本內(nèi)容的處理操作，其中針對(duì)不同的瀏覽器就存在著不同的兼容處理，具體表現(xiàn)在谷歌、火狐與IE瀏覽器之間實(shí)現(xiàn)相同功能采用不同的方法。其中用戶在谷歌、火狐瀏覽器中選擇文本時(shí)需要借助()方法，而IE瀏覽器則借助的是()方法。其具體的用法及區(qū)別一起來(lái)看吧~
3.1 ()方法
()方法返回的是一個(gè)對(duì)象，表示的是用戶選擇到的文本內(nèi)容，支持谷歌、火狐、蘋果等瀏覽器，具體寫法如下：
HTML5學(xué)堂（碼匠） - ()方法
3.2 對(duì)象
對(duì)象代表的是選中區(qū)，即對(duì)于文檔中用戶可執(zhí)行某些操作的元素與內(nèi)容。用戶和JS都可以創(chuàng)建選中區(qū)，用戶創(chuàng)建選中區(qū)的辦法是選中文檔的某一部分；JS創(chuàng)建選中區(qū)是在文本域等位置調(diào)用對(duì)象。而在IE瀏覽器中要操作選中區(qū)需要先使用()方法創(chuàng)建一個(gè)文本域?qū)ο螅唧w使用如下：
HTML5學(xué)堂（碼匠） - 對(duì)象
關(guān)于完整代碼
HTML代碼
HTML5學(xué)堂（碼匠） - HTML代碼
CSS代碼
HTML5學(xué)堂（碼匠） - CSS代碼
代碼
HTML5學(xué)堂（碼匠） - 代碼
如需完整代碼，請(qǐng)點(diǎn)擊下面的地址（有可能因?yàn)榫W(wǎng)絡(luò)原因，導(dǎo)致加載速度較慢）。
代碼地址：
總結(jié)
文本操作是前端開(kāi)發(fā)中一塊比較復(fù)雜的處理操作，究其原因在于各個(gè)瀏覽器都存在著兼容問(wèn)題，所以在各種使用場(chǎng)景中都需要考慮方法的兼容操作。上文中主要就是為大家講解對(duì)象對(duì)于頁(yè)面文本內(nèi)容的選中操作。