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>).


Proprietati obiect Anchor

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.
- Acest atribut indica faptul ca link-ul e pt. download, resursa va fi descarcata cand se da clic pe 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:
- no-referrer - referrer HTTP header nu va fi transmis.
- origin - referrer-ul transmis va fi originea paginii (protocol, domeniu si port).
- unsafe-url - referrer-ul va include originea si 'pathname' din adresa paginii.
<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>

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Care atribut face ca optiunea din <select> sa fie selectata?
checked="checked" selected="selected" disabled="disabled"
<select name="a_name">
 <option value="val1">Optiune 1</option>
 <option value="val2" selected="selected">Optiune 2</option>
</select>
Care din aceste valori CSS creaza culoare gradient pentru fundal?
contain repeat-x linear-gradient
#id {
  background: linear-gradient(top left, #1f1, #fff, #11f);
}
Care cod creaza un array in JavaScript?
[] {} new Object()
var arr = [1, "CoursesWeb.net", "MarPlo.net"];
alert(arr[2]);
Indicati functia PHP folosita pentru redirect la alta pagina.
function() header() switch()
header("Location: http://coursesweb.net/");
exit;
Indicati articolul corect la cuvantul "garden" in propozitia: "... garden is a place with flowers".
An The A
The garden is a place with flowers.
- Gradina este un loc cu flori.
Indicati articolul corect pentru cuvantul: "jardín" (gradina)
la los el
El jardín es un lugar de flores.
- Gradina e un loc cu flori.
Obiectul anchor si Lucru cu adrese din link

Last accessed pages

  1. Accentul si Pronuntia (12797)
  2. Povestea unei celule canceroase (158)
  3. Articolul din limba engleza - The article (33669)
  4. Scoala rugaciunii (128)
  5. Prezentul simplu si continuu - Present Tense Simple and Continuous (67540)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (349)
  2. Curs HTML gratuit Tutoriale HTML5 (257)
  3. Curs si Tutoriale JavaScript (255)
  4. Curs CSS Online Tutoriale CSS3 (238)
  5. Curs PHP MySQL, Tutoriale si Scripturi PHP (229)