Skip to content
Related Articles

Related Articles

HTML | DOM Object Object
  • Last Updated : 07 Feb, 2019
GeeksforGeeks - Summer Carnival Banner

The Object object represents only HTML <object> element. We can access any <object> element by using the getElementById(); and also can create object element by using createElement(); method.

Syntax:

  • It is used to access Object element
    document.getElementById("id"); 
    
  • It is used to create object element
    document.createElement("object");

Property Values:

PropertyDescription
alignIt is used to set or return the alignment of the object
archiveIt is used to set or return a string which is useful in implementation of archive function
borderIt is used to set or returnsthe border around object
codeIt is used to set or return the src url of files of complied java classes.
codeBaseIt is used to set or return URL of components
dataIt is used to set or return the URL of the resource
formIt is used to return parent form’s reference
heightIt is used to set or return object’s height
hspaceSet or return horizontal margin
nameSet or return object’s name
standbyIt is used to sets or return message while object loading
typeIt is used to sets or return the content type for data downloaded
useMapIt is used to sets or returns the name of a image map of client-side
vspaceSets or return vertical margin
widthIt is used to sets or return width of object

Example-1: Access object element and return the URL of the resource




<!DOCTYPE html>
<html>
  
<body>
    <center>
        <object id="myobject"
                width="400" 
        </object>
  
        <p>Click the button to get 
          the URL of the embedded file.</p>
  
        <button onclick="Geeks()">
          Click it
        </button>
  
        <p id="gfg"></p>
    </center>
    <script>
        function Geeks() {
            
            // Accessing Object element.
            var x = 
                document.getElementById(
                  "myobject").data;
            
            document.getElementById(
              "gfg").innerHTML = x;
        }
    </script>
  
</body>
  
</html>

Output:



  • Before clicking on the button:
  • After clicking on the button:

Example-2: Create object element using document.createElement.




<!DOCTYPE html>
<html>
  
<body>
    <center>
  
        <p>Click the button to create an 
          Object element with an embedded file.</p>
  
        <button onclick="Geeks()">
          Click it
        </button>
  
        <p id="gfg"></p>
  
        <script>
            function Geeks() {
                
                // Creating object element.
                var x =
                    document.createElement(
                      "OBJECT");
                
                // Set data of the OBJECT.
                x.setAttribute("data", 
                
                x.setAttribute("width", "400");
                x.setAttribute("height", "100");
                document.body.appendChild(x);
            }
        </script>
    </center>
</body>
  
</html>

Output:

  • Before clicking on the button:
  • After clicking on the button:

Supported Browsers:

  • Google Chrome
  • Mozilla Firefox
  • Edge
  • Safari
  • Opera

full-stack-img

My Personal Notes arrow_drop_up
Recommended Articles
Page :