PHP getElementById and getElementsByTagName

• getElementsByTagName()

getElementById and getElementsByTagName are methods of the PHP DOMDocument class. These methods can be used in PHP to get elements from a HTML document.
- Before to use the methods of the PHP DOMDocument class, you must load the HTML document into a DOMDocument object, like in this code:

// create the DOMDocument object
$dochtml = new DOMDocument();

// load content from a HTML page (or file)
$dochtml->loadHTMLFile('filename.html');

// OR, load the HTML items from a string containing the HTML document
$strhtml = '<html><body>Tags and content.<br></body></html>';
$dochtml->loadHTML($strhtml);

- The $dochtml contains an object with a tree structure of all elements in a HTML document. After this object is created, you can use the DOMDocument methods to access the HTML items (as you can see in the examples below).
- It is indicated to have HTML well-formed, otherways may generate E_WARNING errors when it encounters bad markup.

To traverse the elements of a PHP object, use the foreach() loop instruction.

getElementById

The getElementById('ID') function returns an object that contains the element with a given ID, or NULL if the element is not found.
This function is useful when you want to read the content, or attribute value of a HTML element with a specified ID.
- Use the nodeValue property to get the content of the element returned by getElementById().
- Use the tagName (or nodeName) property to get the name of the tag.

Example, gets the tag name and content of the element with a specified ID:

<?php
$strhtml = '<!doctype html>
<html>
<head>
 <meta charset="utf-8" />
 <title>PHP getElementById, getElementsByTagName</title>
</head>
<body>
 <div id="dv1">https://coursesweb.net</div>
</body></html>';

// create the DOMDocument object, and load HTML from a string
$dochtml = new DOMDocument();
$dochtml->loadHTML($strhtml);

// get the element with id="dv1"
$elm = $dochtml->getElementById('dv1');

// get the tag name, and content
$tag = $elm->tagName;
$cnt = $elm->nodeValue;

echo $tag. ' - '. $cnt;           // div - https://coursesweb.net
?>

getElementsByTagName

The getElementsByTagName('tag') function returns an object that contains all the elements with a given local tag name. The special argument '*' matches all tags.
This function is useful when you want to read the content, or attribute of multiple HTML elements that have the same <tag>.
- Use the getAttribute('attribute') to get the value of a specified attribute.

Example, gets, and outputs the ID and content of each DIV:

<?php
$strhtml = '<!doctype html>
<html>
<head>
 <meta charset="utf-8" />
 <title>PHP getElementById, getElementsByTagName</title>
</head>
<body>
 <div id="cweb">https://coursesweb.net</div>
 <p>Free PHP Course</p>
 <div id="mp">marplo.net</div>
</body></html>';

// create the DOMDocument object, and load HTML from a string
$dochtml = new DOMDocument();
$dochtml->loadHTML($strhtml);

// gets all DIVs
$divs = $dochtml->getElementsByTagName('div');

// traverse the object with all DIVs
foreach($divs as $div) {
  // gets, and outputs the ID and content of each DIV
  $id = $div->getAttribute('id');
  $cnt = $div->nodeValue;

  echo $id. ' - '. $cnt. '<br/>';
}
?>

- You also can use /load only a part of the HTML document.
Example 2. Loads a string containing only the BODY part, store into an Array the content of each paragraph with class="cls".

<?php
$strhtml = '<body>
 <p class="cls">Free PHP Course</p>
 <p class="cls">URL: https://coursesweb.net</p>
 <p>Paragraph without class.</p>
 <div>marplo.net</div>
 <p class="cls">PHP getElementById and getElementsByTagName</p>
</body>';

// create the DOMDocument object, and load HTML from a string
$dochtml = new DOMDocument();
$dochtml->loadHTML($strhtml);

// gets all <p> tags
$prgs = $dochtml->getElementsByTagName('p');
$pcls = array();

// traverse the object with all paragraphs
foreach($prgs as $prg) {
  // if the current paragraph has class="cls", adds it in the $pcls array
  if($prg->getAttribute('class') == 'cls') {
    $pcls[] = $prg->nodeValue;
  }
}

// outputs the $pcls array
print_r($pcls);

// Array ([0] => Free PHP Course [1] => URL: https://coursesweb.net [2] => PHP getElementById and getElementsByTagName )
?>

<<-PHP Method Chaining -- Working with HTML attributes ..->>

Daily Test with Code Example

HTML

CSS

JavaScript

PHP-MySQL

Which tag defines the clickable areas inside the image map?

<img src="image.jpg" usemap="#map1">
<map name="map1">
  <area shape="rect" coords="9, 120, 56, 149" href="#">
  <area shape="rect" coords="100, 200, 156, 249" href="#">
</map>

Which CSS property defines what is done if the content in a box is too big for its defined space?

display overflow position

#id {
  overflow: auto;
}

Click on the event which is triggered when the mouse is positioned over an object.

onclick onmouseover onmouseout

document.getElementById("id").onmouseover = function(){
  document.write("Have Good Life");
}

Indicate the PHP variable that contains data added in URL address after the "?" character.

$_SESSION $_GET $_POST

if(isset($_GET["id"])) {
  echo $_GET["id"];
}