Explication détaillée des propriétés des objets de document javascript et exemples de codes de méthode-js tutoriel-php.cn

Explication détaillée des propriétés des objets de document javascript et exemples de codes de méthode

伊谢尔伦

Libérer： 2017-07-21 13:44:54

original

1519 Les gens l'ont consulté

Chaque document HTML chargé dans le navigateur devient un objet Document. L'objet Document nous permet d'accéder à tous les éléments d'une page HTML à partir de scripts.

Propriétés

1 document.anchors Renvoie les références à tous les objets Anchor du document. Il existe également document.links/document.forms/document.images, etc.

2 document.URL Renvoie l'url du document actuel

3 document.title Renvoie le titre du document actuel document

4 document.body Renvoie le nœud de l'élément de corps

méthode

1 document.close() Ferme le flux de sortie ouvert avec le document. open() et affichez les données de sélection.

<!DOCTYPE html>
<html>
<head>
<script>
function createDoc()
{
var w=window.open();
w.document.open();
w.document.write("<h1>Hello World!</h1>");
w.document.close();
}
</script>
</head>

<body>
<input type="button" value="New document in a new window" onclick="createDoc()">
</body>
</html>

Copier après la connexion

2 document.createElement() Crée un nœud d'élément.

<!DOCTYPE html>
<html lang="en">
<!DOCTYPE html>
<head>
</head>
<body>
  <p>hello world</p>
  
<script>
  var a = document.createElement(&#39;hr&#39;);
  document.body.appendChild(a)


</script>
</body>
</html>

Copier après la connexion

3 document.createAttribute() Crée un nœud d'attribut.

<!DOCTYPE html>
<html>
<body>

<p id="demo">Click the button to make a BUTTON element.</p>

<button onclick="myFunction()">Try it</button>

<script>

function myFunction()
{
var btn=document.createElement("BUTTON");
document.body.appendChild(btn);
};

</script>

</body>
</html>

Copier après la connexion

4 document.createTextNode() Crée un nœud de texte.

<!DOCTYPE html>
<html lang="en">
<!DOCTYPE html>
<head>
</head>
<body>
  <p>hello world</p>

<script>
  var a = document.createTextNode(&#39;hahahah&#39;);
  document.body.appendChild(a)


</script>
</body>
</html>

Copier après la connexion

5 document. getElementsByClassName() Renvoie une collection de tous les éléments avec le nom de classe spécifié dans le document sous la forme d'une collection d'objets NodeList. La collection d'objets NodeList est un format de données similaire à un tableau. Elle fournit uniquement l'attribut de longueur, et les méthodes push et pop dans le tableau ne sont pas fournies.

6 document.getElementById() Renvoie une référence au premier objet avec l'identifiant spécifié.

7 document.getElementsByName() renvoie une collection d'objets avec le nom spécifié.

8 document.getElementsByTagName() renvoie une collection d'objets avec le nom de balise spécifié.

9 document.write() écrit des expressions HTML ou du code JavaScript dans le document. Remarque : L'utilisation de la méthode d'écriture après le chargement du document HTML entraînera l'écrasement du contenu d'écriture par rapport au document HTML d'origine.

<!DOCTYPE html>
<html lang="en">
<!DOCTYPE html>
<head>
</head>
<body>
  <p>hello world</p>

<script>
  document.write(&#39;hahahh&#39;)
</script>
</body>
</html>

Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!