Nwlapcug.com


Come determinare l'altezza del carattere in JavaScript

Come determinare l'altezza del carattere in JavaScript


Utilizza funzioni JavaScript all'interno di una pagina Web, si può determinare e impostare le proprietà del foglio di stile CSS di qualsiasi elemento. Una funzione JavaScript può accedere a qualsiasi elemento della pagina specificata e quindi restituire le informazioni. Per trovare l'altezza di un elemento di testo all'interno di una pagina, è possibile utilizzare la proprietà "offsetHeight" sia il "clientHeight", a seconda di ciò che si intende utilizzare le informazioni per. Scoprire che la altezza del tipo di carattere o testo in JavaScript è semplice, con solo poche righe di codice necessarie.

Istruzioni

1

Crea la tua pagina HTML Web. Se non avete già una pagina, immettere il seguente schema in un nuovo file e salvarlo con il ". Estensione HTML":

< html >

< head >

< style type = "text/css" >

Body {font-size: 14px;}

< / stile >

< script type = "text/javascript" >

Funzioni JavaScript qui

< / script >

< / head >

< corpo >

< div id = "contenuto" > testo < / div >

< / body >

< / html >

La pagina contiene un elemento semplice "div" che è stato designato all'interno dell'area CSS in testa alla pagina. La testa di pagina contiene anche un'area per il codice JavaScript.

2

Immettere una funzione JavaScript all'interno della tua sezione di testa di pagina. Tra i tag di apertura e di chiusura di "script", immettere il seguente schema di funzione per il codice JavaScript:

Function getTextHeight(elemID) () {

implementazione della funzione qui

}

Questa funzione è andando a prendere l'ID di un particolare elemento HTML nella pagina come un parametro e quindi determinare la dimensione del testo all'interno di esso.

3

Utilizzare la funzione JavaScript per ottenere un riferimento all'elemento che ti interessa. Aggiungere il codice seguente tra la funzione di apertura e parentesi di chiusura, l'elemento indicato dal valore ID passato e l'acquisizione di un riferimento ad esso:

var fontElem = document.getElementById(elemID);

La variabile "fontElem" contiene ora un riferimento all'elemento, che è possibile utilizzare per accedere alle informazioni su di esso.

4

Scopri l'altezza dell'elemento HTML. Ci sono due proprietà potete trovare il codice JavaScript che rischiano di essere più utile a voi. Il "clientHeight" indica l'altezza totale del testo o altro contenuto all'interno dell'elemento, ma non include i bordi o margini. Vi si accede come segue:

var elemHeight = fontElem.clientHeight;

Il "offsetHeight" calcola l'altezza compreso i bordi e i margini, accessibili come segue:

var elemHeight = fontElem.offsetHeight;

È possibile verificare la funzione per l'output il valore stabilito:

Alert ("altezza:" + elemHeight);

5

Chiamare la funzione JavaScript. La zona di JavaScript ora definisce una funzione, ma la funzione deve essere chiamata per poter eseguire. Alter corpo apertura tag nella tua pagina come indicato di seguito:

< onload="getTextHeight('content') del corpo" >

La chiamata di funzione è specificando l'ID dell'elemento passando come parametro alla funzione. Salvare il file e aprirlo in un browser per eseguire il test.

Consigli & Avvertenze

  • Utilizzando il metodo di "getElementsByTagName" JavaScript è possibile identificare gli elementi tipo invece di ID.
  • Pagine Web non devono basarsi su JavaScript come alcuni utenti non avere attivato all'interno del proprio browser.