GElement หัวใจของ GAjax

GElement เป็น class ที่สำคัญที่สุดของ GAjax เนื่องจากมันจะถูกรวมเข้ากับ Element ต่างๆ ของ DOM เพื่อเพิ่มเติมคุณสมบัติของมัน เพื่อให้ Element นั้นๆ มีคุณสมบัติเพิ่มเติมหรือสามารถใช้คำสั่ง Javascript กับ Element นั้นๆ ได้อย่าง Cross Browser

การเรียกใช้งาน GElement
var e = $G('element_id')
$G() เป็นคำสั่งแบบสั้นสำหรับการเรียกใช้งาน GElement
element_id สามารถระบุเป็น id ของ Element หรือ name หรือ DOM ก้ได้ เช่น
<input type="text" id="input_id" name="input_name" />
เราสามารถเข้าถึง Element ด้านบนได้ด้วยวิธีต่อไปนี้

// เรียกใช้ด้วย id

var input = $G('input_id');  

// เรียกใช้ด้วย name

var input = $G('input_name');

// คืนค่า element (DOM) ของ input ทั้งหมด

var inps= document.getElementsByTagName('input');

// เรียกใช้ด้วย DOM

var input = $G(inps[0]);

เมื่อรวม Element ที่ต้องการเข้ากับ GElement แล้ว จะทำให้เราสามารถเรียกใช้คำสั่งของ GElement ได้จากตัว Element เอง และนอกจากนี้ เรายังสามารถเรียกใช้งาน คำสั่งพื้นฐานของ Element ได้เหมือนเดิมด้วย

<input id="text_id" type="text" value="Test" />

<input id="button_id" type="button" value="Test" />

<script type="text/javascript">

$G('button_id').onclick = function(){ // คำสั่งของ DOM ปกติ

    $G('text_id').highlight(); // highlight input เมื่อคลิกปุ่ม

};

</script>

ตัวอย่าง