1
00:00:00,300 --> 00:00:01,040
お帰りなさい。

2
00:00:01,050 --> 00:00:03,240
このビデオでは、中止したところで取り上げるつもりです。

3
00:00:03,240 --> 00:00:07,020
私たちは要素を操作する他の方法について話し続けます。

4
00:00:07,020 --> 00:00:12,420
色やスタイルのプロパティを変更する方法や、クラスリストを使用してスタイリングにもどのように影響するかを見てきました。

5
00:00:12,420 --> 00:00:17,330
 

6
00:00:17,640 --> 00:00:22,050
このビデオでは、2つの異なるプロパティについて説明します。両方のプロパティによって、テキストまたは老人をページ上で変更することができます。

7
00:00:22,050 --> 00:00:24,770
 

8
00:00:24,780 --> 00:00:31,080
だから、H1タグの代わりに、または私がここにあるような強力なタグの代わりにコンテンツを変更したいのであれば、アンカータグをテキストに変更したかったのです。

9
00:00:31,350 --> 00:00:35,040
 

10
00:00:35,040 --> 00:00:37,030
それがこのビデオでどうやってやるのか見ていきます。

11
00:00:37,410 --> 00:00:40,590
最初のプロパティはテキストコンテンツと呼ばれるものです。

12
00:00:41,190 --> 00:00:47,430
あなたがここで見ることができるように、私はいくつかのテキストとAwesomeと言う強力なタグ付きの段落を持っています。

13
00:00:47,520 --> 00:00:50,090
そして段落テキストの残りの部分。

14
00:00:50,160 --> 00:00:57,900
 

15
00:00:57,900 --> 00:01:04,500
 

16
00:01:04,620 --> 00:01:08,210
だから私が文書のDuckeryセレクタPでこれを選択した場合、その変数を変数に保存し、その要素の中のテキストを取り出すタグテキストコンテンツを作成し、テキストはHTMLタグ間のものとして定義します。

17
00:01:08,430 --> 00:01:09,870
だからあなたはそれが返ってくるのを見るでしょう。

18
00:01:09,870 --> 00:01:11,760
これはすばらしい段落です。

19
00:01:11,760 --> 00:01:18,110
それは強いタグを含んでいないので、その段落の中からすべてのテキストを抽出するだけです。

20
00:01:18,270 --> 00:01:20,240
しかし、多くの層は深く行く必要があります。

21
00:01:20,280 --> 00:01:23,620
すべてのテキストを取得し、大きな文字列を返します。

22
00:01:24,120 --> 00:01:30,310
もちろん、私はここでテキストコンテンツをタグ付けしたようなテキストコンテンツを設定することもできます。

23
00:01:30,510 --> 00:01:33,830
そして、それは文章の内容を、あんまり曖昧なものに戻すでしょう。

24
00:01:33,870 --> 00:01:35,270
このパラグラフの中に。

25
00:01:35,460 --> 00:01:40,140
さて、テキストコンテンツプロパティを使用する前に、どのように使用できるかを説明します。

26
00:01:40,350 --> 00:01:46,500
私はサンプル・デモであるTim Pageをマークアップのほんの数行で更新して、作業するテキストをいくつか追加します。

27
00:01:46,500 --> 00:01:47,940
 

28
00:01:47,970 --> 00:01:55,740
だから私はULを追加して、この中に花を作ろうと思っています。

29
00:01:55,860 --> 00:01:57,500
だから蘭。

30
00:01:57,900 --> 00:02:04,700
育てて、チューリップを最後にしましょう。

31
00:02:04,730 --> 00:02:05,260
OK。

32
00:02:05,400 --> 00:02:06,560
私たちは先に進んでこれに取り組んでいきます。

33
00:02:06,560 --> 00:02:09,680
JavaScriptのコンソールで。

34
00:02:09,840 --> 00:02:16,800
ここで私たちのページはここ3つの味方と私たちの井戸です。そして、このコラムはスーパーコージーミックスがあなたが見ることができるように超愛らしい言葉の周りに強いタグを持っています。

35
00:02:16,800 --> 00:02:22,380
 

36
00:02:22,560 --> 00:02:24,340
はい、そうです。

37
00:02:24,340 --> 00:02:31,800
だから、私は領事に行くつもりで、まずはこのパラグラフを選択するだけで、Pはドキュメントに等しいです。

38
00:02:32,280 --> 00:02:36,740
そして、私の最初の本能は、それがとても簡単なので常にクエリセレクタを使用することです。

39
00:02:36,900 --> 00:02:38,470
しかし、私はそれをするつもりはありません。

40
00:02:38,580 --> 00:02:41,410
ちょうど私達は別の方法を使用して、もっと練習をします。

41
00:02:41,460 --> 00:02:50,550
タグ名でGET要素を使用するつもりですが、そのタグ名は段落であり、最初のものを依頼する必要があることを覚えておいてください。

42
00:02:50,550 --> 00:02:52,320
 

43
00:02:52,690 --> 00:03:01,620
ですから、Pを見ると、その段落があり、テキストコンテンツのテキストコンテンツを実行すると、コージーミックスは非常に魅力的です。

44
00:03:01,620 --> 00:03:04,320
 

45
00:03:04,320 --> 00:03:06,510
それで、そこにはすべてのテキストが入ります。

46
00:03:06,870 --> 00:03:13,650
UL上で同じことをやってみましょう。これで、UL var

47
00:03:15,470 --> 00:03:17,770
ULを選択して、今度は私はキューリーセレクタulを使用します。

48
00:03:18,150 --> 00:03:19,280
ULを見てみましょう。

49
00:03:19,320 --> 00:03:21,570
正しいものがあることを確認してください。

50
00:03:21,570 --> 00:03:22,820
間違いなく正しい。

51
00:03:22,980 --> 00:03:26,640
そして、そのことについてteksのコンテンツをしましょう。

52
00:03:27,330 --> 00:03:35,030
そして、あなたはそれがタグを取り除くのを見ることができ、それはそのULの中の純粋なテキストコンテンツを取得し、我々ができることはそれを更新することです。

53
00:03:35,040 --> 00:03:37,440
 

54
00:03:37,440 --> 00:03:42,780
 

55
00:03:42,780 --> 00:03:49,070
これは、実際にはちょっと危険です。なぜなら、この段落のテキストコンテンツの内容を更新したいとしています。そして、Corgiミックスが実際にはとても愛らしいと言うように更新したいと考えています。

56
00:03:49,440 --> 00:04:00,630
まあ、私はPテキストのコンテンツを等しくすることができ、その後、コーギーミックスは本当に本当にスーパー愛らしいですが、うまくいけば問題を見ることができます。

57
00:04:00,630 --> 00:04:02,600
 

58
00:04:02,670 --> 00:04:05,890
私はこの強力なタグをここで取り除くつもりです。

59
00:04:06,090 --> 00:04:09,180
私がenterキーを押すと、完全に上書きされます。

60
00:04:09,180 --> 00:04:14,610
だから、もしこの要素を期待すれば、そこにあるものがあればそれを取り除きました。

61
00:04:14,600 --> 00:04:15,490
 

62
00:04:15,600 --> 00:04:20,280
あなたが何かを設定するためにそれを使用しているなら、テキストコンテンツはそれほど危険ではありませんが、悪いことではありませんが、注意する必要があります。

63
00:04:20,280 --> 00:04:22,690
 

64
00:04:22,710 --> 00:04:24,880
あなたは要素の中身を正確に知る必要があります。

65
00:04:24,900 --> 00:04:30,420
Hがある場合。 T.

66
00:04:30,420 --> 00:04:33,720
あなたが保存したい電子メールタグは、すべてのテキストコンテンツをニュースストリームに自動的に設定したくないので、すべてを消去します。

67
00:04:34,050 --> 00:04:39,330
テキストコンテンツと同じ行に沿って動作する別のプロパティがありますが、実際には2つの男性要素がそのまま維持され、テキストを抽出するだけではありません。

68
00:04:39,480 --> 00:04:43,480
 

69
00:04:43,500 --> 00:04:46,240
実際には、毎回正確な構造を維持しています。

70
00:04:46,260 --> 00:04:52,800
要素はInner HMOと呼ばれるようにテキストとともに返されます。

71
00:04:53,580 --> 00:04:55,020
だから私たちは同じ段落を持っています。

72
00:04:55,020 --> 00:04:59,970
これはすばらしい周りに強いタグが付いたすばらしいパラグラフです。

73
00:05:00,060 --> 00:05:07,140
クエリセレクタでそれを選択し、タグドットインナーh m

74
00:05:07,140 --> 00:05:11,870
lを実行すると、そこに強力なタグを保持しながら素晴らしい段落になります。

75
00:05:12,270 --> 00:05:18,510
だから私は別の例を見せて、ページをリフレッシュしてここに強いタグがあるようにして、私は先に進み、段落をもう一度選択します。

76
00:05:18,510 --> 00:05:20,640
 

77
00:05:20,850 --> 00:05:28,040
docクエリセレクタ段落を文書化して実行します。

78
00:05:28,350 --> 00:05:33,760
テキストコンテンツを最初に見直してみましょう。

79
00:05:34,870 --> 00:05:38,350
そして、あなたは強いタグが私たちにも返されるのを見ることができます。

80
00:05:38,940 --> 00:05:43,300
ULとその内部にある嘘についても同じことをしましょう。

81
00:05:43,320 --> 00:05:49,020
したがって、var ULはドキュメントdocクエリセレクタと同じです。

82
00:05:49,770 --> 00:05:58,710
あなたはそれをして、あなたはその内なる者になり、タグも手に入れます。

83
00:05:58,740 --> 00:06:03,150
ですから、これは便利で、私たちが構築したいくつかのプロジェクトでそれを活用するいくつかの状況を見ていきます。

84
00:06:03,150 --> 00:06:04,770
 

85
00:06:04,770 --> 00:06:08,830
テキストは、タグの内容を変更するだけの場合にも便利です。

86
00:06:09,120 --> 00:06:15,240
だから、通常は私たちは実際に何かになるように内部を設定していません。なぜなら、現在怒られている内容を上書きするテキストコンテンツを設定するのと同じ問題だからです。

87
00:06:15,250 --> 00:06:20,820
 

88
00:06:20,820 --> 00:06:21,300
 

89
00:06:21,510 --> 00:06:31,820
だから私はあなたがULのドット内部のHTMLは植物が素晴らしいことに等しい今だと言いましょう。

90
00:06:32,870 --> 00:06:36,170
テキストコンテンツの場合とまったく同じように、それを完全にオーバーライドします。

91
00:06:36,210 --> 00:06:41,530
したがって、新しい要素を追加したい場合や、HTMLとやりとりしたい場合は、それを行うための他の方法があります。

92
00:06:41,760 --> 00:06:45,440
しかし、例えば私たちがやりたいことが、このタイトルを変更しているのならば。

93
00:06:45,450 --> 00:06:47,750
私のDomのデモへようこそ。

94
00:06:47,810 --> 00:06:49,340
最初に選択することができます。

95
00:06:49,470 --> 00:06:50,410
それはH-1です。

96
00:06:50,730 --> 00:06:53,420
そして、彼の中に彼がいないことに気づきます。

97
00:06:53,430 --> 00:06:54,850
それはちょうどH-1です。

98
00:06:54,990 --> 00:06:59,000
だから、私たちはテキストコンテンツかエネルギーM-Lのどちらかを使うことができます。

99
00:06:59,010 --> 00:07:03,190
しかし、ほとんどの人はテキストコンテンツを使用します。それはそれがすべてテキストコンテンツだからです。

100
00:07:03,360 --> 00:07:05,530
そして、それを他のものに戻すことができました。

101
00:07:05,580 --> 00:07:12,060
 

102
00:07:12,060 --> 00:07:17,970
 

103
00:07:17,970 --> 00:07:29,760
だからそれはちょうどドキュメントの問題であろうが、再びクエリーセレクタをやってみよう。私はこのドキュメントセレクタH-1を見るのに慣れるために変数にそれを保存しないだろう。ドットテキストの内容はこのレッスンと同じです。

104
00:07:29,760 --> 00:07:33,060
そして、私の変化が反映されているのを見ることができます。

105
00:07:33,060 --> 00:07:39,180
だから、テキストコンテンツを要約すると、我々はそれを最初に選択し、我々はそれを怒ら実行する要素のコンテンツをつかむの2つの異なる方法をHD M -

106
00:07:39,540 --> 00:07:42,750
Lを入力します。

107
00:07:42,810 --> 00:07:49,860
または、その選択された要素のテキストコンテンツのテキストコンテンツは、テキストのみを抽出し、大きな文字列をテキストで返し、彼を激怒させます。

108
00:07:49,860 --> 00:07:55,970
 

109
00:07:57,240 --> 00:07:59,000
だから最後に少しボーナスがあります。

110
00:07:59,190 --> 00:08:04,120
これは覚えておいてくれるものではありませんが、怒られたHTMLとテキストコンテンツの間には別の違いがあります。

111
00:08:04,120 --> 00:08:07,100
 

112
00:08:07,350 --> 00:08:14,700
この文書ダンプ本体のようなものを試してみましょう。これは私たちに全身の内部HMOを提供します。

113
00:08:15,420 --> 00:08:21,230
 

114
00:08:21,240 --> 00:08:30,090
そして、体のすべてのHTMLを取得したかどうかを確認することができます。このようなテキストコンテンツを入力して同じことをすることができます。この3行だけのテキストをページに表示します。

115
00:08:31,230 --> 00:08:36,480
 

116
00:08:36,480 --> 00:08:42,840
 

117
00:08:42,840 --> 00:08:50,550
 

118
00:08:50,550 --> 00:08:57,700
私ができることは私が変更したいのであれば、私はこのページのすべてを取り除きたいと思っています。それは本当に良いアイデアではありませんが、私が望むなら新しいH-1とそれをH-1ちょうど、私はこのドキュメントのような何かを行うことができたと言って、bodycamテキストコンテンツequalsと私はここにH-1タグを入れて、このような私はHMOを書いている何かを行うことができます。

119
00:08:57,930 --> 00:08:59,380
そして私がエンターを押した場合。

120
00:08:59,940 --> 00:09:02,190
実際はうまくいきません。

121
00:09:02,190 --> 00:09:07,070
したがって、テキストコンテンツは文字列をHMOとして扱うことはありません。

122
00:09:07,080 --> 00:09:14,540
それは純粋にテキストとして扱われるので、私は彼に憤慨して同じことをした場合と比べてH-1タグを表示しません。

123
00:09:14,550 --> 00:09:15,460
 

124
00:09:17,520 --> 00:09:19,400
彼女のHMOで

125
00:09:20,340 --> 00:09:22,740
実際にH-1としてレンダリングされているのが分かります。

126
00:09:22,830 --> 00:09:28,440
それはニュアンスですが、重要な違いです。テキストコンテンツは、それがあなたに与えるものであれ、テキストとしてだけでなく、彼の中にあるものであれ、何でもそれを扱います。

127
00:09:28,440 --> 00:09:31,560
 

128
00:09:31,600 --> 00:09:36,210
私は実際にH M Lのように扱い、レンダリングするためにタグを付けるとページ上にレンダリングされます