Skip to content

Working with DOM

bapquad edited this page Feb 20, 2022 · 4 revisions

[Home] > Working with DOM

This content we learn how to work with DOM elements in Element5JS API.

Using the selector query

element5js provide you a selector query allow you select any DOM element in your application. By example;

console.log(element5("#wrapper"));

In above example, we select a DOM element has id that wrapper. After selected a DOM element, you can use modifiers to manipulate with selected DOM element.

element5("#wrapper").css({
  "color": "green", 
  "font-size": "3rem"
});

You can get body and window objects by using following methods.

let body = element.GetBody(); 
let wind = element.GetWindow();

Create a DOM element

element5js allow you create a DOM element by using Create method like as following

let heading = element5.Create("h2#heading");

When you create a DOM element, it saved on a variable, but it is not visible on your document yet.

Create a device

element5js provide a tool for helping to create a device.

let iPhone6s = element5.MountDevice({
  deviceOption: "", 
  deviceType: "screen", 
  features: ["max-width:375px"], 
  producted: false
});

Typically, the device interfaces allow you test your application on other devices in making responsive for an application.

Create an extension

element5js allow you create an extension for more purposes.

$.extends({
  say: function(msg)
  {
    console.log(msg)
  }
});
element5("#wrapper").say("Hello");