JavaScript上級1 正規表現、Cookie管理、UserData_基礎知識

WBOY
リリース: 2016-05-16 17:55:25
オリジナル
1017 人が閲覧しました

首先,什么事正则表达式呢,其实引入概念很多时候并不能帮我们明白它到底是什么,所以我先简单描述下,正则表达式,其实就是一个记录字符串规则则的字符串,等我们看完这一部分,也就能明白它到底是什么了。

基本语法:正则表达式就是“/expression/”+表示搜索范围的符号。例如我们要找function这个关键词,就是/function/gi,其中g表示global,就是全局搜索,i表示ignor,就是忽略大小写。

在js中,我们通过RegExp类来实现。

这个类里面有很多很多的符号用来表示不同的索引方法,我先把这个表列一列:

元字符 说明 量词 说明 反义字符 说明
  . 匹配除了换行符号(\n)以外的任意字符   * 出现次数:[0,+∞)   \W 字母,数字,下划线,汉字以外的字符
  ^ 匹配字符串的开始   + 出现次数:[1,+∞)   \S 空白字符以外的字符
  $ 匹配字符串的结束   ? 出现次数:[0,1]   \D 数字以外的字符
  \b 匹配单词边界   {n}   出现次数:n   \B 匹配非单词的边界
  \d 匹配数字   {n,} 出现次数:[n,+∞)   [^] 在字符类中,^号后面的字符串以外的任意字符
  \s 匹配任意的空白符   {n,m}   出现次数:[n,m]   [-] 匹配从-前字符到-后字符的字符串中的字符/数字
  \w 匹配字母,数字,下划线或汉字        

上記の記号に加えて、3 つの概念があります。1 つはグループ化、1 つは後方参照、最後は候補です。
グループ化: 文字列を () で囲み、特定の規則に従って文字列を結合できるようにすることを指します。同時に、正規表現を使用して日付形式を表現するなど、括弧をネストすることもできます。 var dateReg=/^(d{1,4})(-)(d{1,2}(-)(d {1 ,2})$), もちろん、この方法にもいくつかの抜け穴があります。ここでは形式の問題を表現するだけです。
これらに加えて、角かっこもあります。たとえば、文字 x y z d w の 1 つだけを一致させたい場合は、[xyzdw] と書きます。数字 0 ~ 4 など、一致する場合は [0] となります。 -4] ですが、これは 1 文字のみを表します。
ac または bd を一致させるなど、複数を記述したい場合は、「|」記号を使用して (ac|bd) と記述します。
たとえば、abc のみを含む文字列と一致させたい場合は、次のように記述できます。 abdReg=/^[abc] $/; 以下は完全な例です。
コードをコピー コードは次のとおりです。

head>
正規表現
var str="agega" >
var abcReg=/^[abc] $/g;
var test1=false;
var test2=false;
if(abcReg.test(str))
test1=true;
if(abcReg.test(str2))
test2=true;
document.write("文字列 " str " の結果は次のとおりです: " test1 "
文字列 " str2 " の結果は次のとおりです: " test2) ;







逆方向参照: グループ化に基づく正規表現のアプリケーションです。まず、グループ番号を知る必要があります。左括弧でマークされた左から右のグループの順序に従い、1 から累積していきます。使用方法は 2 つあります: $group 番号またはグループ番号。
2 番目は、式内のグループを参照するのに適しています。「」は、通常と同じ意味を持つエスケープ記号です。予約文字と一致するときに使用されます。
たとえば、abc で始まり abc で終わり、途中に制限がない文字列と一致させたいとします。 Reg=/^(abc)[a-z]*1$/; 次の文を試してみてください。先ほどの例では、テストしましたが、エラーはありませんでした。
一般的に使用されるいくつかの一致正規表現:
1. 一致する日付: reg=/^d{4}-(((0[13578]|(10|12))-(0[1-9] | [1-2]d|3[01]))|(02-(0[1-9])|[1-2]d)|((0[469]|11)-(0[1- 9] ]|[1-2]d|30))$/g;
2. マッチング時間: reg=/^([0-1]d|[2][0-3](:([ 0 -5]d)){2}$/g;
3. 一致する電子メール アドレス: reg=/^([a-zA-Z]([0-9a-zA-Z]|(_))* @(([0-9a-zA-Z]|(_)) .) [a-zA-Z]{2,9})$/g;
4. 中国語の文字に一致します: reg=/^[ u4e00-u9fa5] $/g;
JavaScript は Cookie を操作します
Cookie が何であるかは誰もが知っていると思うので、容赦なく定義をコピーしました。
js で Cookie を操作するためのステートメントは次のとおりです。 cookie=name "="value ";expires=" date.toGMTString();
次に、Cookie を使用してログイン用のユーザー名とパスワードを記録します



コードをコピーします コードは次のとおりです:
cookie test



<フォーム名メソッド ="post" アクション = "#" >



= "center" >password:
= "center" >
; /テーブル>



エスケープは単純な暗号化であり、有効期間は通常 1 週間に設定され、1 週間後に自動的に削除されることを説明します。
もちろん、Cookie を書いただけで読み込まなければ無駄になりますので、Cookie ファイルの内容を読み取る方法を学ぶ必要があります。
そこで、スクリプトに 2 つの読み取り関数を追加しました:
コードをコピーします コードは次のとおりです:




body タグ onload イベント:

つまり、このコードは IE と FF では正しく実行されますが、Chrome では Cookie を取得できません。 。全く分かりません~どなたか理由が分かる方教えてくださいorz
Cookieの有効期限の変更はCookieの内容を変更するのと同じで、expiresフィールドの内容を見つけて変更するだけです。 . Cookieを削除したい場合は有効期限を昨日に設定すればOKです。
userData
userData は cookie とは異なり有効期限がなく、より多くのデータを保存できるため (640KB cookie: 4KB)、ページの入力量が多い場合には userData を使用してデータを保存できます。
データを userData に保存する: 主に 2 つの部分があります。コンテンツに名前を付けて userData に保存します。
学習する前に、これは Microsoft によって開発されたものであるため、テストの結果、FF と chrome には互換性がないことが示されたことに注意してください。
保存されたアルマナックに関する画像は次のとおりです:


OK 次に、userData を見てみましょう。 まずスクリプトの前にスタイルを追加し、パラメータを設定して userData に保存します。





.userData
>{
behavior:url(#default#userdata);




<テーブル幅="400" align="center" border="1">




<入力タイプ="ボタン" name="保存" value="confirm">

>
🎜>



コードをコピー


コードは次のとおりです:


関数 getContent(){
var formObj=formObj.content;
contentObj.value=contentObj.getAttribute ("contentText");
}

変更後の完全なプログラム:
コードをコピーします コードは次のとおりです:



Cookie テスト

.userData{behavior:url(#default#userData);}




<フォーム名="フォーム" メソッド="ポスト" アクション="#">
<テーブル幅="400" align="center" border="1">













ユーザー名:
title:
content: /td>
タイトル:
コンテンツ:





よろしくお願いします、互換性も可能です:(下ではこのセクションはすべて抄造されており、転送が多すぎるため、私も道源が不明です。)
localStorage:方式、localStorage 自体の利点: 容量大、使いやすさ、强大、原生サポート; 欠点は互換性の差 (chrome、safari、firefox、IE 9、IE8都サポート localStorage、主に IE8 以下のバージョンはサポートされません)、安全性

非常に一般的に普及しているインターフェイス:

localStorage.getItem(key): 指定されたキーをローカルに保存する値
localStorage.setItem(key,value): 値をキーフィールドに保存します
localStorage.removeItem(key):删除指定キー本地に存在する值

念のためlocalStorage に存在する值都は文字列型、在json データなどの単純なデータを処理する場合は、JSON クラスを使用して、json 文字列を実際に使用できる json 形式に変換する必要があり、localStorage の 2 番目の実践教程では、関連する機能を表示することに重点を置いています。
の現在の視聴者には、優れた送信者調整機能が組み込まれています。以下は、それぞれ Chrome と Firefox の調整ツールです。

は、非常に良い評価をいただいております。良かったです。これで再び壊れることはありません。
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のおすすめ
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート