Ⅰ 《web前端筆記7》js字元—獲取、查找、遍歷、提取、替換方法總結
(1)字元串就是零個或多個排在一起的字元。
(2)放在單引號或雙引號之中。 'abc' "abc"。
(3)單引號字元串的內部,可以使用雙引號。
(4)雙引號字元串的內部,可以使用單引號。
(5)反引號`` :反引號允許跨行。
反引號允許字元串跨越多行並可以使用
${…} 在字元串中嵌入表達式。
(1)charAt 方法返回指定位置的字元,參數是從0開始編號的位置。
找一個字元串中的某個位置是那個字元串。
charCodeAt:返回字元串指定位置的 Unicode 碼點(十進製表示)
(2)[]
字元串可以被視為字元串數組,因此可以用數組的方括弧運算符,用來返回某個位置的字元
但是字元串只是數組的相似性而已實際上、沒辦法改變字元串中的某個字元
length 只是返回了字元串的長度,該屬性沒辦法改變
字元串使用Unicode字元集,js內部所有的都是Unicode表示的。
JavaScript中的字元串使用的是 UTF-16 編碼。
toLowerCase() 和 toUpperCase()方法可以改變大小寫。
String對象是js原生提供的三個包裝對象之一。用來生成字元串對象。
(1)構造函數
字元串對象是一個類數組對象,很像數組,但不是真正的數組。
(2)將任意的值轉成字元
用於連接兩個字元串,返回一個新字元串,不改變原字元串。
從原字元串取出子字元串並返回,不改變原字元串。
它的第一個參數是子字元串的開始位置,
第二個參數是子字元串的結束位置(不含該位置)。
如果省略第二個參數,則表示子字元串一直到原字元串結束。
用於從原字元串取出子字元串並返回,不改變原字元串,跟slice方法很相像。
它的第一個參數表示子字元串的開始位置,
第二個位置表示結束位置(返回結果不含該位置)
如果省略第二個參數,則表示子字元串一直到原字元串結束。
區別:slice 和 substring的區別?
slice:
如果參數是負值,表示從結尾開始倒數計算的位置,即該負值加上字元串長度。
如果第一個參數大於第二個參數(正數情況下),slice()方法返回一個空字元串。
substring:
如果第一個參數大於第二個參數,substring方法會自動更換兩個參數的位置。
如果參數是負數,substring方法會自動將負數轉為0。
由於這些規則違反直覺,因此不建議使用substring方法,應該優先使用slice。
總結:獲取子字元串,使用 slice 或 substring。
用於確定一個字元串在另一個字元串中第一次出現的位置,
返回結果是匹配開始的位置。如果返回-1,就表示不匹配。
indexOf方法還可以接受第二個參數,表示從該位置開始向後匹配。
lastIndexOf
lastIndexOf方法的用法跟indexOf方法一致,主要的區別是lastIndexOf從尾部開始匹配,indexOf則是從頭部開始匹配。
總結:查找子字元串時,使用 indexOf 或 includes/startsWith/endsWith 進行簡單檢查。
endsWith 用來判斷當前字元串是否是以另外一個給定的子字元串「結尾」的,根據判斷結果返回 true 或 false。
用於去除字元串兩端的空格,返回一個新字元串,不改變原字元串。
toLowerCase方法用於將一個字元串全部轉為小寫,
toUpperCase則是全部轉為大寫。
它們都返回一個新字元串,不改變原字元串
split方法按照給定規則分割字元串,返回一個由分割出來的子字元串組成的數組。
如果分割規則為空字元串,則返回數組的成員是原字元串的每一個字元。
如果省略參數,則返回數組的唯一成員就是原字元串。
split方法還可以接受第二個參數,限定返回數組的最大成員數。
返回一個新字元串,表示將原字元串重復n次。
字元串補全長度的功能。如果某個字元串不夠指定長度,
會在頭部或尾部補全。padStart()用於頭部補全,padEnd()用於尾部補全。
trimStart()消除字元串頭部的空格,
trimEnd()消除尾部的空格。
返回一個由替換值(replacement)替換部分或
所有的模式(pattern)匹配項後的新字元串。
模式可以是一個字元串或者一個正則表達式,
替換值可以是一個字元串或者一個每次匹配都要調用的回調函數。
如果pattern是字元串,則僅替換第一個匹配項.
web前端筆記4-有講 如果感興趣、請參考之前文章
Ⅱ Web前端新手應該知道的JavaScript開發技巧有哪些
今天小編要跟大家分享的文章是關於Web前端新手應該知道的JavaScript開發技巧有哪些?熟悉Web前端的小夥伴都知道,Javascript
的很多擴展的特性是的它變得更加的犀利,同時也給予程序員機會創建更漂亮並且更讓用戶喜歡的網站。
盡管很多的開發人員都樂於頌揚javascript,但是仍舊有人看到它的陰暗面。
使用很多javascript代碼的Web頁面會載入很慢,過多的使用javascript使得網頁醜陋和拖沓。很快如何有效地使用
javascript成為一個非常火熱的話題。
今天小編就為Web前端新手准備了這篇JavaScript開發技巧,希望能夠對你有所幫助,下面我們一起來看一看吧!
1、盡可能的保持代碼簡潔
可能大家都聽到過了N遍這個代碼簡潔問題了。作為一個開發人員你可能在你的代碼開發過程中使用了很多次,但千萬不要在js開發中忘記這點。
§盡量在開發模式中添加註釋和空格,這樣保持代碼的可讀性
§在發布到產品環境前請將空格和注釋都刪除,並且盡量縮寫變數和方法名
§使用第三方工具幫助你實現壓縮javascript。
2、思考後再修改prototypes
添加新的屬性到對象prototype中是導致腳本出錯的常見原因。
yourObject.prototype.anotherFunction='Hello'
yourObject.prototype.anotherMethod=function(){...}
在上面代碼中,所有的變數都會被影響,因為他們都繼承於yourObject。這樣的使用會導致意想不到的行為。所以建議在使用完後刪除類似的修改。
yourObject.prototype.anotherFunction='Hello'
yourObject.prototype.anotherMethod=function(){};
test.anotherMethod();
deleteyourObject.prototype.anotherFunction='Hello'
deleteyourObject.prototype.anotherMethod=function(){};
3、DebugJavascript代碼
即使最好的開發人員都會犯錯。為了最大化的減少類似錯誤,請在你的debugger中運行你的代碼,確認你沒有遇到任何細微的錯誤。
4、避免Eval
你的JS在沒有eval方法的時候也可以很好的工作。eval允許訪問javascript編譯器。如果一個字元串作為參數傳遞到
eval,那麼它的結果可以被執行。
這會很大的降低代碼的性能。盡量避免在產品環境中使用eval。
5、最小化DOM訪問
DOM是最復雜的API,會使得代碼執行過程變慢。有時候Web頁面可能沒有載入或者載入不完整。最好避免DOM。
6、在使用javascript類庫之前先學習javascript
互聯網充斥著很多的javascript類庫,很多程序員都往往使用js類庫而不理解負面影響。強烈建議你在使用第三方類庫之前學習基本的JS
代碼,否則,你就准備著倒霉吧。
7、不要用「SetTimeOut」和「Setinterval」方法來作為「Eval」的備選
setTimeOut("document.getID('value')",3000);
在以上代碼中document.getID(『value』)在setTimeOut方法中被作為字元串來處理。這類似於eval
方法,在每個代碼執行中來執行一個字元串,因此會降低性能,因此,建議在這些方法中傳遞一個方法。
setTimeOut(yourFunction,3000);
8、[]比newArray();更好
一個常犯的錯誤在於使用當需要數組的時候使用一個對象或者該使用對象的時候使用一個數組。但是使用原則很簡單:
「當屬性名稱是小的連續整數,你應該使用數組。否則,使用一個對象」_DouglasCrockford,JavaScript:Good
Parts的作者.
建議:
vara=[ƇA',ƈB'];
避免:
vara=newArray();
a[0]="1A";
a[1]="2B";
9、盡量不要多次使用var
在初始每一個變數的時候,程序員都習慣使用var關鍵字。相反,建議你使用逗號來避免多餘的關鍵字,並且減少代碼體積。如下:
varvariableOne='string1',
variableTwo='string2',
variableThree='string3'
10、不要忽略分號「;」
這往往是大家花費數個小時進行debug的原因之一。
我很確信你肯定也在其它的文章中閱讀過以上相關的內容,但是大家可能往往都忽略了很多基本的規則。你是不是也曾經忽略過分號。是不是也遇到過eval
關鍵字問題導致性能問題?
以上就是小編今天為大家分享的關於Web前端新手應該知道的JavaScript
開發技巧有哪些?的文章,希望本篇文章能夠對剛剛接觸Web前端行業的新手們有所幫助。想要了解更多Web前端知識記得關注北大青鳥Web前端培訓官網!
*聲明:內容與圖片均來源於網路(部分內容有修改),版權歸原作者所有,如來源信息有誤或侵犯權益,請聯系我們刪除或授權事宜。
Ⅲ 如何去除 JSP 生成的 HTML 中的空格和換行
在WEB應用中,如果使用jsp作為view層的顯示模板,都會被空格/空換行問題所困擾.
這個問題當年也困擾了我比較長的時間.因為在jsp內使用的EL標簽和其他標簽時,會產生大量的空格和換行符.例如:
復制代碼代碼如下:
------- start ----------
<c:choose>
<c:when test="${fn:length(mainPageList)>1&}">
Something
</c:when>
<c:otherwise>
Others
</c:otherwise>
</c:choose>
------- end -----------
這段代碼在Tomcat上輸出如下,多了幾行換行。
復制代碼代碼如下:
------- start ----------
Something
------- end -----------
當然,一般不去特別留意是不會發現有什麼問題的,畢竟輸出再多的空格和換行符,對於瀏覽器生成的最終效果是一樣的。也就是大部分開發人員忽略這個問題的原因;但實際上這些空格和換行會佔用了不少空間,我的經驗是30%左右是空格/換行。也有人說,當web伺服器以zip的方式來輸出html時,空格引起的帶寬問題就可以解決了;是的,當使用zip來輸出html時,空格/換行的空間會被節省回來,但這個增加zip的工作量,而且最大的問題是,瀏覽器生成頁面時,還是會還原所有的空格的換行符。對於前端開發人員來說這是個噩耗,面對大量的空格和冗長的html源碼,想要找到對應出問題的樣式所在的位置可不是容易的事情。
下面說一下解決方案,以Tomcat為例:
方案一,利用web伺服器的trimSpaces功能。
Tomcat5 以上版本都可以使用,這是最簡單的方法。
復制代碼代碼如下:
<servlet>
<servlet-name>jsp</servlet-name>
<servlet-class>org.apache.jasper.servlet.JspServlet</servlet-class>
<init-param>
<param-name>fork</param-name>
<param-value>false</param-value>
</init-param>
<init-param>
<param-name>trimSpaces </param-name>
<param-value>true </param-value>
</init-param>
<init-param>
<param-name>xpoweredBy</param-name>
<param-value>false</param-value>
</init-param>
<load-on-startup>3</load-on-startup>
</servlet>
這個方案有個缺點,它會去掉所有jsp EL標簽之間的空格的換行符,在部分情況下也來帶來不便。
如:Your name is ${firstName} ${lastName}. ==輸出為==> Your name is firstNamelastName.
兩個${}變數之間的空格也會消失。要解決這個問題是相當麻煩,要引入一個只有一個空格的變數。
<c:set var="one_space"> </c:set>
Your name is ${firstName}${one_space}${lastName}.
這樣就正常了,麻煩。雖然可以在一些全局變數的地方來增加一個one_space的變數,但代碼看上去還是不爽。
方案二,我比較喜歡。
這個方案只有在支持jsp 2.1的web伺服器上才可以使用,如Tomcat6。
Jsp2.1多了一個很有用的命令;
<%@ page trimDirectiveWhitespaces="true" %>
這個命令可以使jsp輸出的html時去除多餘的空行(jsp上使用EL和tag會產生大量的空格和空行),沒有使用trimSpaces的問題,現在jsp輸出html也可以很好地排版,看上去也專業;以前我一直都羨慕velocity的模板,輸出html十分干凈好看,現在jsp也可以了。
另外提一下,Tomcat6有一些兼容性問題,例如不能使用#{}這種代碼在jsp中,因為會被當成JSF腳本執行。
雖然這是一個很小的問題,但我們還是要注意細節。
Ⅳ 如何在web頁面中添加多個空格
& e m s p ;和 & n b s p ; 分別是全形空格符和半形空格符,重復輸入可加多個空格
基本表單元素有input radio button textarea select/option 等
Ⅳ 前端開發主要學哪些內容
1、HTML超文本標記性語言:盡量掌握盡可能多的標記或標記對。
(1)必須掌握的標記或標記對包括:<html>、<head>、<title>、<body>、<h1>、<p>、<a>、<img>、<table>、<tr>、<td>、<th>、<form>、<input>、<select>、<option>、<textarea>、<div>、<span>、<script>、<link>等。
4、操作系統
了解Unix和Linux的基本知識,對於開發人員有益無害。
5、網路伺服器
了解Web伺服器,包括對Apache的基本配置,htaccess配置技巧的掌握等。
Ⅵ web前端 nbsp空格能不能疊加
可以
多打幾個即可
如
Ⅶ 前端開發應該學習什麼內容
前端開發應該學習的內容有PC端網站布局、HTML5+CSS3基礎項目、WebAPP頁面布局等。
學習web前端開發,網頁開發工具有FrontPage,會用 Word 的人很容易學會FrontPage。還有一個常用的是Dreamweaver。這兩種都是使用最多的HTML網頁製作工具。
4、html5和css3。可以先了解一下,然後再入手。畢竟IE的瀏覽器大多還不支持。
5、瀏覽器兼容。懂web標准,熟練手寫 xhtml css3 並符合 符合w3c標准。代碼能兼容主流瀏覽器Firfox,Chrome、Safari、IE、Opera。雖然IE6很多都不兼容,但現在還使用的人還是有的。
6、熟悉一門後台編程語言 asp、php、jsp等。
Ⅷ 請問這個web前端的頁面要怎樣空格
你那個</div>放錯地方了 要麼用完整的div來包裹下面的ul 要麼就刪掉 想調整頁面元素的高度如果不是絕對定位的話給<ul class="mui-table-view" >加上一條 屬性
style="margin-top: 100px"
就是改成這樣
<ulclass="mui-table-view"style="margin-top:100px">
100px可以隨便調整
建議看一遍html跟css基礎,一上來就用現成架構出東西的速度是快,但是這么基本的問題都不能自己解決後期很吃力的
Ⅸ 網頁前端如何實現回車/空格按照正則自動分割輸入的數據
str.split(/\s+/)
空格回車換行等等空白字元切割