-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathlesson8.html
107 lines (105 loc) · 5.02 KB
/
lesson8.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<html>
<head>
<meta charset="utf-8">
<meta name="application-name" content="KITAB regex tutorial">
<meta name="created" content="2021-05-05">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>KITAB regex tutorial - lesson 8: More precise quantification</title>
<link rel="stylesheet" type="text/css" href="css/styles.css" />
<!--<script src="https://unpkg.com/xregexp/xregexp-all.js"></script>--> <!--regular expressions library with support for unicode code blocks-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/xregexp/3.2.0/xregexp-all.min.js"></script>
</head>
<body>
<h1>Regex tutorial for humanists</h1>
<div id="tutorial">
<h2>8. More precise quantification</h2>
<p>
Sometimes, it's not enough to state that a character may be present "one or more"
times; you might want to state exactly how many times it may be present.
This is expressed in regular expressions using the curly braces <span class="regex">{}</span> .
For example, if you are searching for words that are exactly 5 characters,
you could use this regex: <span class="regex">\w{5}</span>.
</p>
<p>
You may also want to allow a range of numbers: <span class="regex">\w{5,8}</span>
will match any sequence of 5, 6, 7 or 8 word characters.
</p>
<p>
You can also leave out either the start or end number to express "maximum X"
or "minimum X": <span class="regex">\w{,8}</span> will match any sequence
of up to 8 word characters, while <span class="regex">\w{8,}</span>
will match any sequence of minimum 8 word characters.
</p>
<p>
In the search field below, use quantifiers to write a pattern
that matches all schools with 10,000 students or more.
</p>
</div>
<div id="exercise" type="full_match"> <!-- possible types: full_match, partial_match -->
<div id="exercise_title">
Exercise 8: match all schools with 10,000 students or more.
</div>
<div id="samples">
<table>
<thead>
<tr>
<th>Task</th>
<th>Text</th>
<th> </th>
</tr>
<!-- line below the table heading: -->
<tr><td style="border-top:1px solid black;" colspan="3"></td></tr>
</thead>
<tbody>
<tr>
<td class="instruction">Don't match this string</td>
<td class="sample" match="Saint Paul's High School: 1,199 students">Saint Paul's High School: 1,199 students</td>
<td class="correctOrNot"></td>
</tr>
<tr>
<td class="instruction">Match this string entirely</td>
<td class="sample" match="London School of Economics: 11,000 students">London School of Economics: 11,000 students</td>
<td class="correctOrNot"></td>
</tr>
<tr>
<td class="instruction">Don't match this string</td>
<td class="sample" match="Sample Primary School: 562 students">Sample Primary School: 562 students</td>
<td class="correctOrNot"></td>
</tr>
<tr>
<td class="instruction">Don't match this string</td>
<td class="sample" match="Home school: 1 student">Home school: 1 student</td>
<td class="correctOrNot"></td>
</tr>
<tr>
<td class="instruction">Match this string entirely</td>
<td class="sample" match="Yale University: 16494 students">Yale University: 16494 students</td>
<td class="correctOrNot"></td>
</tr>
</tbody>
</table>
</div>
<div id="input">
<input id="solution_input" autocomplete="off" autocapitalize="off" autocorrect="off" spellcheck="false" placeholder="Type your regex pattern" solution=".+: \d{2,},?\d{3} students"></input>
<input id="next_button" type="button" onclick="location.href='lesson9.html';" value="Next lesson" disabled title="Get the solution first!"/>
</div>
<div id="hintOrSolution">
<input id="hint_button" type="button" onclick="showHint()" value="Hint" title="Get a hint"/>
<input id="solution_button" type="button" onclick="showSolution()" value="Solution" title="Take the hint before you get the solution!" disabled/>
</div>
<div id="hint" style="display:none;">
There's no pattern in the names of the schools, so you can match any sequence of
characters before the colon. For the number of students, think about how many digits may be present
for numbers starting from 10,000. Also observe that some
numbers contain a comma, others don't: you will have to make the comma optional.
</div>
<div id="solution" style="display:none;">
"More than one character, followed by a colon and a space;
followed by a at least two digits and and a single optional comma,
then 3 more digits, then a space and the word students."
</div>
</div>
<input id="back_button" type="button" onclick="location.href='lesson7.html';" value="Back"/>
<script type="text/javascript" src="js/script.js"></script>
</body>
</html>