Velociraptor (som betyr "swift seizer" på latin) er en ...
Beskrivelse
Velociraptor var en mellomstor dromaeosaurid, med voksne ...
fjær
Fossiler av dromaeosaurider mer primitiv enn ...
Oppdagelseshistorie
Under et amerikansk museum for naturhistorisk ekspedisjon ...
Klassifisering
Velociraptor er medlem av gruppen Eudromaeosauria, en avledet undergruppe av ...
Paleobiology
"Fighting Dinosaurs" -prøven, funnet i 1971, opprettholder en ...
Skjeveadferd
I 2010 publiserte Hone og kollegaer et papir på ...
metabolisme
Velociraptor var varmblodig i noen grad, da det krevde en ...
Patologi
En Velociratoptor mongoliensis skalle bærer to parallelle ...
Som du ser, får hver overskrift en unik slot
.
Og her er HTML-koden til TOC, inne i a stikkord.
I de to kodestykket ovenfor merker du de tilhørende slot
og navnegenskapene i overskriftene og
2. Nummer overskriftene
Før du ser på JavaScript-koden som vil legge til TOC fra til dokumentet, la oss legge til serienumre for overskriftene, ved hjelp av CSS-tellere .
artikkel {counter-reset: heading; } artikkel h2 :: før {counter-increment: heading; innhold: '0'counter (heading)': '; }
Kontroller at motstandsinnstillingsregelen tilhører elementet som er nærmeste forelder for alle titlene som bærer sporetattributtet (som er det
3. Sett inn TOC i dokumentet
Nå legger vi til skriptet som legger inn TOC over
templateContent = document.querySelector ('mal'). innhold; artikkel = document.querySelector ('article'). cloneNode (true); article.attachShadow ({modus: 'lukket'}). appendChild (templateContent.cloneNode (true)); document.querySelector ( '# toc') appendChild (artikkel).;
Kodestykket ovenfor lager en kopi av
Så klonet Hvis vi ville tilbakestille CSS-telleren på Her er skjermbildet av utgangen: Hvis du vil koble TOC-titlene til deres respektive overskrifter og underposisjoner ved å legge til Velociraptor (som betyr "swift seizer" på latin) er en ... Velociraptor var en mellomstor dromaeosaurid, med voksne ... Fossiler av dromaeosaurider mer primitiv enn ... Som du kan se over, legges Og titlene i innholdsfortegnelsen er forankret : I den ekstra linjen ovenfor fjernes alle Se skjermbildet av den koblede innholdsfortegnelsen nedenfor: Du kan sjekke ut, laste ned eller gaffel koden som brukes i dette innlegget fra vår Github Repo. Facebook og din personvern: hvorfor det gjelder Kunnskap er makt. Det er ingen bedre måte å sette den i denne informasjonens alder av oss. I vår svært digitaliserte verden er det enkelt for alle å samle informasjon om deg hvis du bruker noen form for teknologi. Faktisk, jo mer du setter teknologi som en del av livet ditt, jo lettere er det å samle intelligens om deg.I mot 50 nettsteder som betaler deg for å skrive eller blogge Hvis du elsker å skrive og alltid har hatt en drøm om å se arbeidet ditt, men ikke ønsker å starte eller administrere en blogg for å ha alle dine skrifter, hvorfor ikke skrive for en blogg eller publikasjon og få betalt for det?I dette innlegget har vi samlet 50 nettsteder som vil betale deg for meninger, veiledninger, veiledninger, kreativ skriving og generelt, bra materiale til leserne. Nisjebody
eller html
elementet i stedet for article
, ville telleren ha telt listen over overskrifter i TOC også. Det er derfor du burde tilbakestille tellerne på den nærmeste overordnet av overskriftene .id
i overskriftene og forankre deres tilsvarende TOC-tekst, må du fjerne de repeterende id
verdiene fra den klonede article
. Beskrivelse
fjær
id
attributtet til hver overskrift og underposisjon i artikkelen .id
attributter fra den klonte artikkelen før du legger til Shadow DOM-treet. templateContent = document.querySelector ('mal'). innhold; artikkel = document.querySelector ('article'). cloneNode (true); article.querySelectorAll ('* [id' '). forEach ((ele) => {ele.removeAttribute (' id ')}) artikkel.attachShadow ({modus:' lukket '}). appendChild (templateContent.cloneNode )); document.querySelector ( '# toc') appendChild (artikkel).;