-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathdata-attrs.html
38 lines (32 loc) · 3.28 KB
/
data-attrs.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
<!DOCTYPE html>
<html>
<head>
<script>
function showDetails(animal) {
let animalType = animal.getAttribute("data-animal-type");
alert("The " + animal.innerHTML + " is a " + animalType + ".");
}
</script>
</head>
<body>
<h1>Species</h1>
<p>Click on a species to see what type it is:</p>
<ul>
<li onclick="showfunc(this)" id="owlabcd" data-animal-type="hello8anfmCNeduhyQqedBrF5AdTt4UJBXwfrnutMQRAQ4nvtgXHLJcfAtyLvY6qP1DDahHdq62gXNnNKfUVYjwPzxbHGu1gAzrHyPJ1cSnTHfd5xQWWbcQ28wv7bYgK07fdiP8LeWCGQ7B0hp8p86EeYAYGPAXACi0DPU8Z2wQENwekaapMErMvv6hqzqzdfjkxv7xrrngqX3nrWjree3vjbUvykm40RmtAK3f934PuMuqcYtHzJ1nMFNxYZeFwAAwB3EHHW3u8bXwQ2cP2A6RaiREyNfjmzdhycEikc26GSUG6tceK0rZ1edqHZTqF9ypGZQPWLKiZAbubPLSkMEFyk8j88rAwSgAYE1YgXhky96gN9gyE5KhJCzrE55AuLQ6V9BVJbYYxiVmHJrcTND0rjvrZ2rH9y0G4pJVA8yFqV6mkYSwiU62y8ibE0y5rT2r9HQ3iY6zZcAqaBDGk9qwYeUe3k7C3PwEgaWfLeXCjW7eBqVrLbqDx0RNKrYU64J8bb7pZKkVgtQKXTiGcnVmggKWZCh9A7cPC5w3xUa8hiDbJ1np3HaaNLXt1xdHXQWdVdm81phPHhQP3TAfGxf6kLFkSHpeG94vfG5kLzAeeDfUP9V4ijWbmA1e6rTQLD3KG6yTuM9vbxrQqRKvBt3hyGTCt0uhxTZTF9226qfWUm9303MKyMguyHyJRRhPRyhueqzGPtf6JpNUTUQ7Kiu7JuwwpnwZpKXQfqgUf2GnzJkqeinuCUWQ4zzLdTcgNQg2aCudLqN2NxhVwKLF5W3fbeStgd">Owltext</li>
<li onclick="showDetails(this)" id="salmon" data-animal-type="VC4SFhkwR2qwahrMgtryWFtQbQ6p0EQBvu64E3NddiVtS8uDtCLVGEQqPhG5QvzP9yamTTxz51fYch9zQUhmbnve54iaa9TPz751mK1V9th8gde5aB5c8vkCm6dCnUeFiWSGSax76qA6Xe8G3t34TXf6HrBeb6yCmyYTjZeGxBTbx1t5gPMjYYABMacDe9qwQYBFvvPDcaTm87Q2xfSzm6yEudgqzRBCmdLYUYKD2xY1UjQighaCK0t4WSpR51XnFEYu9pTRrg9n4wq6N7BSiFYb3bRwaMbzhWSBGtLMcr3LSExEPB67XHu7BhWNhaFkMCA96T9XvNhM2CSLqR17x7gLqCW2Nvg3UAmcBvaLDhUXYQMwSkrLKFXdcNxb8jgJ4NBShJapxmRyGzptBnbSH2hum3aTnpXN1M2gphvxfN8LQHaMqVKrZB7xvWHNBFASfVmbFqeJkb9vgJrY8D9wJXKL7VrVMaiVjAgewmS0Tbbqk8qPnY1E0LXiA05qe0MbcjDYLGKT7QWkpFn6efXCxXX7TJySZhfTLxK8SgePUfQVSzZagagNxVRaYdX8VZpKtyNzCmWt59rzELNiE6hzKSjtwGwS2Hx0jSRrjnPRk54B4R2t3T50iLGqYZbMv9nfEDeTUDgYpbdhYrjMZXKwKUYGuVUbcxKe2TV00X6BQDBwD9YR7mkwmcJQvTQiij1DwLeazga1aEn1WPUiZuh6SQ8QvZNCNf6PXFWmLkvwHY9H2WE6UrLELMrpex1RG5YNXdJnCHnGDax1fwhnmN2YpGnCjiC8eZmm">Salmon</li>
<li onclick="showDetails(this)" id="tarantulahello" data-animal-type="ZZFrYjCpBn5whhFf7LWnZC522NnWDGhaEiyCNnSCS2xfr0XG2Vpzz9t7HnpcLcNGkQpxzpRZmu8Fz4gth8PCPukyp3FXFBBC0qP2S9m1LqfuKmiPddtqwvc0cD053qPktShCeX0qX3X70xagVq98wewxW9qjjWr1xiWW4TY3TWtbuMcuXH2XfwrqCT2HnWFYvFYM7zQjE1HXdxAakUKVz59fqtWh58Bqxt515S0WkT0j80NArhrnYWKrhwqS7wK7ABkmuHyjyPNJMhdK7k7uCxwcBmhcxFEW5YVB2U2m3zLnkPVuHv7xgiiA4BzLHFd6fPn1nPbKDXReAtvZwchEj7ZxHxgDa1fuV5WgiqDJ5PxEjfz5Ua16CZhwrT6aYxa3up6k4diS1XSdBnMTY7UUYVA0KBeMRHRYNKaWDnkV5qDdwC9SPit2UxMJQS7JJjv77qJpS6NWE3G6gSBZZMtbZew187t2rDQ2mWjSjxdYwgyNxd5YQWXpKSrh6mgT0qmp4TyDyiuB73yJ87X5ftpG1uH58Bx8i7bSXw5aa1kqq1q0Kb4vuMQVzM2v8TBC1ZP8yEGLd2DCEXtxvqnY0inYqxzwNZGGMtBWRCLbcCcN7Jt1FxbaemQ3TxhBQgRLq8iHEtBYcW90AZNCfDmukrmJPawS0SuZPWiKLaNctYv0TGRQQpdvwTGGunvPpbaHbHeHjdaA3uTwGYRDvPbD7JDDuJhvrmmDxk5wtjuQCytP4rxAWK6P8WDSvuZzjiqAiLVy07x7xgpCFuV5DAMg6fTmq0Ua47pt7hcp">Tarantula</li>
</ul>
</body>
<script>
const characters ='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
function generateString(length) {
let result = ' ';
const charactersLength = characters.length;
for ( let i = 0; i < length; i++ ) {
result += characters.charAt(Math.floor(Math.random() * charactersLength));
}
return result;
}
console.log(generateString(5));
</script>
</html>