Obiectul anchor reprezinta elementele HTML <a> (folosite pentru link-uri).
In afara de proprietatile si metodele specifice elementelor html (prezentate la: marplo.net/javascript/proprietati-metode-element-html ), obiectul anchor contine si proprietati proprii, utile pentru lucru cu adrese URL (link-uri adaugate in elemente <a>).
Proprietatile obiectului anchor sunt similare cu cele de la obiectul navigator, dar se aplica la elementele <a> preluate /create in JavaScrip.
download - returneaza sau seteaza valoarea atributului 'download' dintr-un link.
<p>Exemplu link cu atribut download.<br>
- La clic pe link, resursa de la adresa 'href' va fi descarcata.</p>
<a href='/imgs/smile_gift.png' title='Image' id='lnk1' download='smile'><img src='/imgs/smile_gift.png' alt='Smile' width='40' height='35'> Link image</a>
<p>La clic pe urmatorul buton va fi adaugat la #resp valoarea atributului download.</p>
<button id='btn1'>Attr download</button>
<blockquote id='resp'>#resp</blockquote>
<script>
document.getElementById('btn1').addEventListener('click', (ev)=>{
var dwl = document.getElementById('lnk1').download;
document.getElementById('resp').innerHTML = dwl;
});
</script>
hash - returneaza sau seteaza sirul din adresa de la 'href' care urmeaza dupa caracterul diez (#).
<p>Exemplu #hash.<br>
<a href='/javascript/proprietati-metode-element-html#hshmoh' title='Metode obiect html' id='lnk1'>/javascript/proprietati-metode-element-html#hshmoh</a>
</p>
<p>Portiunea 'hash' din link e: <em id='resp'>hash</em></p>
<script>
var hash = document.getElementById('lnk1').hash;
document.getElementById('resp').innerHTML = hash;
</script>
host - contine numele domeniului si numarul de port (daca e specificat) din adresa de la 'href'.
<p>Exemplu link.host<br>
<a href='https://marplo.net/javascript' title='Curs JS' id='lnk1'>https://marplo.net/javascript</a>
</p>
<p>Proprietatea 'host' contine: <em id='resp'>host</em></p>
<script>
var host = document.getElementById('lnk1').host;
document.getElementById('resp').innerHTML = host;
</script>
hostname - contine numele domeniului din adresa de la 'href'.
<p>Exemplu link.hostname<br>
<a href='https://marplo.net/html' title='Curs HTML' id='lnk1'>https://marplo.net/html</a>
</p>
<p>Proprietatea 'hostname' contine: <em id='resp'>host</em></p>
<script>
var hostn = document.getElementById('lnk1').hostname;
document.getElementById('resp').innerHTML = hostn;
</script>
href - seteaza sau returneaza adresa completa de la 'href'.
<p>Exemplu link.href<br>
<a href='//marplo.net/javascript' title='Curs JavaScrip' id='lnk1'>Test Link</a>
</p>
<p>La clic pe buton afiseaza la #resp valoarea de la 'href', apoi adauga alta adresa.<br>
- La al doilea clic pe buton va afisa noua adresa.</p>
<button id='btn1'>Attr href</button>
<blockquote id='resp'>#resp</blockquote>
<script>
document.getElementById('btn1').addEventListener('click', (ev)=>{
var lnk = document.getElementById('lnk1');
document.getElementById('resp').innerHTML = lnk.href;
lnk.href ='//gamv.eu/';
});
</script>
origin - contine partea din adresa de la 'href' cu protocol, hostname (domeniu) si port (daca e specificat).
<p>Exemplu link.origin<br>
<a href='https://marplo.net/javascript' title='Curs JavaScrip' id='lnk1'>https://marplo.net/javascript</a>
</p>
<p>Proprietatea origin contine: <em id='resp'>origin</em></p>
<script>
var org = document.getElementById('lnk1').origin;
document.getElementById('resp').innerHTML = org;
</script>
password - returneaza sau seteaza partea 'password' (parola) din adresa de la 'href' (daca e specificata, inainte de numele domeniului).
<p>Exemplu link.password<br>
<a href='//nume_user:parola@marplo.net/ajax' title='Curs ajax' id='lnk1'>//nume_user:parola@marplo.net/ajax</a>
</p>
<p>La clic pe buton afiseaza la #resp valoarea de la 'password', apoi adauga alta parola.<br>
- La al doilea clic pe buton va afisa noua parola.</p>
<button id='btn1'>password</button>
<blockquote id='resp'>#resp</blockquote>
<script>
document.getElementById('btn1').addEventListener('click', (ev)=>{
var lnk = document.getElementById('lnk1');
document.getElementById('resp').innerHTML = lnk.password;
lnk.password ='alt-pass';
});
</script>
pathname - returneaza sau seteaza partea din adresa de la 'href' dupa numele domeniului, cu '/' la inceput.
<p>Exemplu pathname.<br>
<a href='//marplo.net/javascript/sintaxajs.html' title='Sintaxa JS' id='lnk1'>marplo.net/javascript/sintaxajs.html</a>
</p>
<p>La clic pe buton adauga la #resp valoarea proprietatii 'pathname', apoi seteaza alt 'pathname'.<br>
- La al doilea clic pe buton va afisa noua adresa.</p>
<button id='btn1'>pathname</button>
<blockquote id='resp'>#resp</blockquote>
<script>
document.getElementById('btn1').addEventListener('click', (ev)=>{
var lnk = document.getElementById('lnk1');
document.getElementById('resp').innerHTML = lnk.pathname;
lnk.pathname ='/javascript/obiectul-string';
});
</script>
port - returneaza sau seteaza numarul port-ului din adresa link-ului (daca e specificat).
<p>Exemplu link.port<br>
<a href='https://marplo.net:4097/html' title='Curs HTML' id='lnk1'>https://marplo.net:4097/html</a>
</p>
<p>Proprietatea 'port' contine: <em id='resp'>port</em></p>
<script>
var port = document.getElementById('lnk1').port;
document.getElementById('resp').innerHTML = port;
</script>
protocol - returneaza sau seteaza partea de protocol din adresa link-ului, cu ':' la sfarsit.
<p>Exemplu protocol.<br>
<a href='https://marplo.net/javascript' title='Curs JavaScrip' id='lnk1'>https://marplo.net/javascript</a>
</p>
<p>Proprietatea protocol contine: <em id='resp'>protocol</em></p>
<script>
var protocol = document.getElementById('lnk1').protocol;
document.getElementById('resp').innerHTML = protocol;
</script>
referrerPolicy - returneaza sau seteaza valoarea atributului referrerpolicy. Se pot seta urmatoarele valori:
<p>Exemplu referrerPolicy.<br>
<a href='//marplo.net/html/linkuri.html' title='Creare linkuri' id='lnk1' referrerpolicy='origin'>Link cu atribut referrerpolicy</a>
</p>
<p>La clic pe buton afiseaza la #resp valoarea proprietatii 'referrerPolicy', apoi seteaza alta valoare.<br>
- La al doilea clic pe buton va afisa valoarea adaugata.</p>
<button id='btn1'>referrerPolicy</button>
<blockquote id='resp'>#resp</blockquote>
<script>
document.getElementById('btn1').addEventListener('click', (ev)=>{
var lnk = document.getElementById('lnk1');
document.getElementById('resp').innerHTML = lnk.referrerPolicy;
lnk.referrerPolicy ='no-referrer';
});
</script>
rel - returneaza sau seteaza valoarea atributului rel.
<p>Exemplu link.rel<br>
<a href='//marplo.net/html/linkuri.html' title='Creare linkuri' id='lnk1' rel='nofollow'>Link cu atribut rel</a>
</p>
<p>La clic pe buton afiseaza la #resp valoarea proprietatii 'rel', apoi seteaza alta valoare.<br>
- La al doilea clic pe buton va afisa valoarea adaugata.</p>
<button id='btn1'>Seteaza rel</button>
<blockquote id='resp'>#resp</blockquote>
<script>
document.getElementById('btn1').addEventListener('click', (ev)=>{
var lnk = document.getElementById('lnk1');
document.getElementById('resp').innerHTML = lnk.rel;
lnk.rel ='follow';
});
</script>
search - returneaza sau seteaza sirul 'query' (parametri dupa '?') din adresa link-ului, inclusiv '?'.
<p>Exemplu link.search<br>
<a href='//marplo.net/stai-linistit.htm?id=1&pg=page' title='Stai linistit' id='lnk1'>marplo.net/stai-linistit.htm?id=1&pg=page</a>
</p>
<p>Proprietatea search contine: <em id='resp'>search</em></p>
<script>
var src = document.getElementById('lnk1').search;
document.getElementById('resp').innerHTML = src;
</script>
target - returneaza sau seteaza valoarea atributului 'target'.
<p>Exemplu link.target<br>
<a href='//marplo.net/css' title='Curs css' target='_blank' id='lnk1'>Curs CSS</a>
</p>
<p>Proprietatea target contine valoarea: <em id='resp'>target</em></p>
<script>
var target = document.getElementById('lnk1').target;
document.getElementById('resp').innerHTML = target;
</script>
title - returneaza sau seteaza valoarea atributului 'title' din link.
<p>Exemplu link.title<br>
<a href='//marplo.net/stai-linistit.htm' title='Pacea-i buna. Stai linistit' id='lnk1'>Test link</a>
</p>
<p>Proprietatea title contine: <em id='resp'>title</em></p>
<script>
var title = document.getElementById('lnk1').title;
document.getElementById('resp').innerHTML = title;
</script>
text - returneaza sau seteaza textul link-ului.
<p>Exemplu link.text.<br>
<a href='//marplo.net/html/linkuri.html' title='Creare linkuri' id='lnk1'>marplo.net/html/linkuri.html</a>
</p>
<p>La clic pe buton afiseaza la #resp textul link-ului, iar la link adauga ca text valoarea de la 'title'.<br>
- La al doilea clic pe buton va afisa textul adaugat.</p>
<button id='btn1'>Sets link text</button>
<blockquote id='resp'>#resp</blockquote>
<script>
document.getElementById('btn1').addEventListener('click', (ev)=>{
var lnk = document.getElementById('lnk1');
document.getElementById('resp').innerHTML = lnk.text;
lnk.text = lnk.title;
});
</script>
username - returneaza sau seteaza partea 'username' (nume_user) din adresa de la 'href' (daca e specificat, inainte de numele domeniului).
<p>Exemplu link.username<br>
<a href='//nume_user:parola@marplo.net/ajax' title='Curs ajax' id='lnk1'>//nume_user:parola@marplo.net/ajax</a>
</p>
<p>La clic pe buton afiseaza la #resp valoarea de la 'username', apoi adauga alta nume.<br>
- La al doilea clic pe buton va afisa numele adaugat.</p>
<button id='btn1'>username</button>
<blockquote id='resp'>#resp</blockquote>
<script>
document.getElementById('btn1').addEventListener('click', (ev)=>{
var lnk = document.getElementById('lnk1');
document.getElementById('resp').innerHTML = lnk.username;
lnk.username ='alt_nume';
});
</script>
<p>Cursuri, Jocuri, Anime: <em>www.MarPlo.net</em></p>
h3 {
padding: 2px 0.2em;
}// preia primul Div cu class="cls", si afiseaza continutul
var elm = document.querySelector("div.cls");
alert(elm.innerHTML);if(isset($_POST["field"])) {
echo $_POST["field"];
}We speak english. - Noi vorbim engleza.
Nosotros hablamos español. - Noi vorbim spaniola.