JavaScript Document Object : สอน method และ property ของ Document Object, เรียน method และ property ของ Document Object
 

Reference

Reference ในเว็บไซต์ Function.in.th เป็นการนำเสนอความรู้ในรูปแบบของแหล่งอ้างอิงของคำสั่งต่าง ๆ ที่ใช้ในการเขียนโปรแกรม โดยผู้ที่สนใจสามารถเข้ามาเรียนรู้การใช้งานคำสั่งของการเขียนโปรแกรมเหล่านี้ได้ ผ่านทาง URL code.function.in.th ทั้งนี้ผู้อ่านยังสามารถร่วมแสดงความคิดเห็นบนเนื้อหาที่มีสอนได้ ซึ่งถือเป็นการส่งเสริมให้มีการแลกเปลี่ยนประสบการณ์และความรู้ระหว่างผู้อ่านด้วยกันเอง
  • write() ใช้เขียนข้อความลงบนเอกสาร
    writeln() ใช้เขียนข้อความลงบนเอกสาร และเมื่อเขียนเสร็จจะขึ้นบรรทัดใหม่
    clear() ใช้ลบข้อความที่เขียนลงเอกสาร โดยคำสั่ง write
    focus() ใช้กำหนดให้ document ได้รับ focus
    blur() ใช้กำหนดให้ document สูญเสีย focus
    URL ใช้กำหนด หรือคืนค่า url ของ web page ที่กำลังเรียกใช้งาน
    referrer ใช้คืนค่า URL ของ web page ที่โหลด web page ปัจจุบันขึ้นมา
    domain ใช้คืนค่า domain ของ web page นี้
    cookie ใช้กำหนด หรือคืนค่า cookie ที่เกี่ยวข้องกับ web page นี้
    title ใช้กำหนดค่า หรือคืนค่า title ของ web page นี้
    lastModified ใช้คืนค่า วันและเวลา ที่ทำการแก้ไขไฟล์ครั้งล่าสุด
    bgColor ใช้กำหนดค่า หรือคืนค่า สีพื้นหลังของ web page นี้
    fgColor ใช้กำหนดค่า หรือคืนค่า สีตัวอักษรของ web page นี้
    linkColor ใช้กำหนดค่า หรือคืนค่า สีของ link ที่ยังไม่ถูกคลิก
    vlinkColor ใช้กำหนดค่า หรือคืนค่า สีของ link ที่เคยถูกคลิกแล้ว
    alinkColor ใช้กำหนดค่า หรือคืนค่า สีของ link ที่กำลังถูกคลิก
    body ใช้กำหนดให้ อ้างถึง element body
    anchors ใช้กำหนดให้อ้างถึง element anchor
    embeds ใช้กำหนดให้อ้างถึง element embed
    forms ใช้กำหนดให้อ้างถึง element form
    images ใช้กำหนดให้อ้างถึง element image
    links ใช้กำหนดให้อ้างถึง element link
    styleSheets ใช้กำหนดให้อ้างถึง element style
    layers ใช้กำหนดให้อ้างถึง element layer
    documentElement ใช้กำหนดให้อ้างถึง root ของ node ( คือ element html )
    getElementsByTagName() ใช้ในการคืนค่า element ที่มี tag ตามที่กำหนด
    getElementById() ใช้ในการคืนค่า element ที่มี id ตามที่กำหนด
    getElementsByName() ใช้ในการคืนค่า element ที่มี name ตามที่กำหนด
    createAttribute() ใช้สร้าง attribute node
    createElement() ใช้สร้าง element node
    createTextNode() ใช้ในการสร้าง text node ( ข้อความใน tag คำสั่งของ html )
    cookie ใช้กำหนดค่าหรือคืนค่า cookie
    new ActiveXObject() ใช้ในการสร้าง xml document
    async ใช้กำหนดค่า หรือคืนค่า ว่าอย่าเพิ่งประมวลผลใดๆจนกว่าจะโหลดเอกสาร xml เสร็จ
    load() ใช้ในการโหลดเอกสาร xml เข้ามาใน object ที่สร้าง
    loadXML() ใช้ในการกำหนดคำสั่งภาษา xml ให้กับ object ที่สร้าง
  • method :
    write ( string );

    return type :
    void

    content :
    ใช้เขียนข้อความลงบนเอกสาร

    example :
    window.document.write ( "<b>welcome</b>" );

  • method :
    writeln ( string );

    return type :
    void

    content :
    ใช้เขียนข้อความลงบนเอกสาร และเมื่อเขียนเสร็จจะขึ้นบรรทัดใหม่

    example :
    window.document.writeln ( "<b>welcome</b>" );

  • method :
    clear ();

    return type :
    void

    content :
    ใช้ลบข้อความที่เขียนลงเอกสาร โดยคำสั่ง write

    example :
    window.document.clear ();

  • method :
    focus ();

    return type :
    void

    content :
    ใช้กำหนดให้ document ได้รับ focus

    example :
    window.document.focus ();

  • method :
    blur ();

    return type :
    void

    content :
    ใช้กำหนดให้ document สูญเสีย focus

    example :
    window.document.blur ();

  • property :
    URL;

    return type :
    string, void

    content :
    ใช้กำหนด หรือคืนค่า url ของ web page ที่กำลังเรียกใช้งาน

    example :
    window.document.URL = "http://www.bamboolabcode.com";

  • property :
    referrer;

    return type :
    string

    content :
    ใช้คืนค่า URL ของ web page ที่โหลด web page ปัจจุบันขึ้นมา

    example :
    alert ( window.document.referrer );

  • property :
    domain;

    return type :
    string

    content :
    ใช้คืนค่า domain ของ web page นี้

    example :
    alert ( window.document.domain );

  • property :
    cookie;

    return type :
    string, void

    content :
    ใช้กำหนด หรือคืนค่า cookie ที่เกี่ยวข้องกับ web page นี้

    example :
    alert ( window.document.cookie );

  • property :
    title;

    return type :
    string, void

    content :
    ใช้กำหนดค่า หรือคืนค่า title ของ web page นี้

    example :
    window.document.title = "welcome to bamboolabcode";

  • property :
    lastModified;

    return type :
    string

    content :
    ใช้คืนค่า วันและเวลา ที่ทำการแก้ไขไฟล์ครั้งล่าสุด

    example :
    alert ( window.document.lastModified );

  • property :
    bgColor;

    return type :
    string

    content :
    ใช้กำหนดค่า หรือคืนค่า สีพื้นหลังของ web page นี้

    example :
    alert ( window.document.bgColor );

  • property :
    fgColor;

    return type :
    string

    content :
    ใช้กำหนดค่า หรือคืนค่า สีตัวอักษรของ web page นี้

    example :
    alert ( window.document.fgColor );

  • property :
    linkColor;

    return type :
    string

    content :
    ใช้กำหนดค่า หรือคืนค่า สีของ link ที่ยังไม่ถูกคลิก

    example :
    alert ( window.document.linkColor );

  • property :
    vlinkColor;

    return type :
    string, void

    content :
    ใช้กำหนดค่า หรือคืนค่า สีของ link ที่เคยถูกคลิกแล้ว

    example :
    alert ( window.document.vlinkColor );

  • property :
    alinkColor;

    return type :
    string, void

    content :
    ใช้กำหนดค่า หรือคืนค่า สีของ link ที่กำลังถูกคลิก

    example :
    alert ( window.document.alinkColor );

  • property :
    body;

    return type :
    node, body

    content :
    ใช้กำหนดให้ อ้างถึง element body

    example :
    var tagBody = window.document.body;
    alert ( tagBody.tagName );

  • property :
    anchors;

    return type :
    node array, anchor array

    content :
    ใช้กำหนดให้อ้างถึง element anchor

    example :
    var tagAnchor = window.document.anchors;
    alert ( tagAnchor[0].tagName );

  • property :
    embeds;

    return type :
    node array, embed array

    content :
    ใช้กำหนดให้อ้างถึง element embed

    example :
    var tagEmbed = window.document.embeds;
    alert ( tagEmbed[0].tagName );

  • property :
    forms;

    return type :
    node array, form array

    content :
    ใช้กำหนดให้อ้างถึง element form

    example :
    var tagForm = window.document.forms;
    alert ( tagForm[0].tagName );

  • property :
    images;

    return type :
    node array, image array

    content :
    ใช้กำหนดให้อ้างถึง element image

    example :
    var tagImage = window.document.images;
    alert ( tagImage[0].tagName );

  • property :
    links;

    return type :
    node array, link array

    content :
    ใช้กำหนดให้อ้างถึง element link

    example :
    var tagLink = window.document.links;
    alert ( tagLink[0].tagName );

  • property :
    styleSheets;

    return type :
    node array, style array

    content :
    ใช้กำหนดให้อ้างถึง element style

    example :
    var tagStyle = window.document.styleSheets;
    alert ( tagStyle[0].tagName );

  • property :
    layers;

    return type :
    node array, layer array

    content :
    ใช้กำหนดให้อ้างถึง element layer

    example :
    var tagLayer = window.document.layers;
    alert ( tagLayer[0].tagName );

  • property :
    documentElement;

    return type :
    node

    content :
    ใช้กำหนดให้อ้างถึง root ของ node ( คือ element html )

    example :
    var tagHTML = document.documentElement;
    alert ( tagHTML.tagName );

  • method :
    getElementsByTagName ( string );

    return type :
    node array

    content :
    ใช้ในการคืนค่า element ที่มี tag ตามที่กำหนด โดยจะคืนค่า element นั้นมาทั้งหมด

    example :
    var tagDiv = document.getElementsByTagName ( "div" );
    for ( var i=0; i<tagDiv.length; i++ )
    {
         alert ( tagDiv.item(i).tagName );
    }

  • method :
    getElementById ( string );

    return type :
    node

    content :
    ใช้ในการคืนค่า element ที่มี id ตามที่กำหนด โดยจะเป็นการเข้าถึง element ใด element หนึ่งโดยเฉพาะ

    example :
    var tagDiv = document.getElementById ( "bamboo" );
    alert ( tagDiv.tagName );

  • method :
    getElementsByName ( string );

    return type :
    node array

    content :
    ใช้ในการคืนค่า element ที่มี name ตามที่กำหนด โดยจะคืนค่า element นั้นมาทั้งหมด

    example :
    var tagDiv = document.getElementsByName ( "labcode" );
    for ( var i=0; i<tagDiv.length; i++ )
    {
         alert ( tagDiv.item(i).tagName );
    }

  • method :
    createAttribute ( attribute_name );

    return type :
    node

    content :
    ใช้สร้าง attribute node

    example :
    var attrNode = document.createAttribute ( "id" );
    attrNode.nodeValue = "bamboo";

  • method :
    createElement ( tag_name );

    return type :
    node

    content :
    ใช้สร้าง element node ( สร้าง tag คำสั่งของ html )

    example :
    var tagDiv = document.createElement ( "div" );

  • method :
    createTextNode ( string );

    return type :
    node

    content :
    ใช้ในการสร้าง text node ( ข้อความใน tag คำสั่งของ html )

    example :
    var textNode = document.createTextNode ( "welcome" );

  • property :
    cookie;

    return type :
    string

    content :
    ใช้กำหนดค่าหรือคืนค่า cookie โดยมีรูปแบบดังนี้ CookieData; expires=expDate; 
    path=pathName; domain=domainName; secure
    ( โดยค่าของ cookie เป็น ช่องว่าง, คอมม่า, เซมิโคลอน ไม่ได้ )

    example :
    var my_date = new Date();
    document.cookie = "name=bamboo; expires=" + my_date.toUTCString() + ";";

    comment :
    ตัวแปร cookieData คือชื่อและค่าข้อมูลของคุ้กกี้ เช่น user:panda/age:68
    ตัวแปร expires คือวันหมดอายุของคุ้กกี้ ถ้าไม่กำหนดจะหมดทันทีที่ออกจาก web page
    ตัวแปร path คือใช้กำหนดพาธที่ใช้เก็บคุ้กกี้ โดยปกติแล้วจะถูกเก็บไว้ที่ "c:\Documents and Settings\
    Administrator\Cookies\" โดยถ้าต้องการใช้คุ้กกี้ใช้ได้ใน page อื่นๆ ให้กำหนดพาธในระดับบนสุดของ directory
    ตัวแปร domain คือกำหนดชื่อโดเมนของ server ถ้าไม่กำหนดจะถือว่าเป็น domain เดียวกับ page ที่สร้างคุ้กกี้นี้ 
    ( บาง web site อาจมี domain ย่อยๆ เช่น music.sanook.com, football.sanook.com จะทำให้คุ้กกี้มองไม่เห็นกัน 
    วิธีแก้ปัญหาคือ กำหนด domain=sanook.com ก็จะใช้คุ้กกี้เดียวกันได้ )
    ตัวแปร secure คือกำหนดเมื่อต้องการส่งคุ้กกี้ไปยัง HTTP Server ที่สนับสนุน SSL ( browser ก็ต้องสนับสนุนด้วย )

  • method :
    new ActiveXObject ( "Microsoft.XMLDOM" );

    return type :
    document

    content :
    ใช้ในการสร้าง xml document

    example :
    var xmlDocument = new ActiveObject ( "Microsoft.XMLDOM" );

  • property :
    async;

    return type :
    boolean

    content :
    ใช้กำหนดค่า หรือคืนค่า ว่าอย่าเพิ่งประมวลผลใดๆจนกว่าจะโหลดเอกสาร xml เสร็จ ( กำหนดเป็น false )

    example :
    var xmlDocument = new ActiveObject ( "Microsoft.XMLDOM" );
    xmlDocument.async = false;

  • method :
    load ( file );

    return type :
    void

    content :
    ใช้ในการโหลดเอกสาร xml เข้ามาใน object ที่สร้าง

    example :
    var xmlDocument = new ActiveObject ( "Microsoft.XMLDOM" );
    xmlDocument.async = false;
    xmlDocument.load ( "bamboo.xml" );

  • method :
    loadXML ( string_xml );

    return type :
    void

    content :
    ใช้ในการกำหนดคำสั่งภาษา xml ให้กับ object ที่สร้าง

    example :
    var xml = "<?xml version='1.0' encoding='windows-874' ?>";
    xml += "<website><name>bamboolabcode</name><name>basicskill</name></website>";
    var xmlDocument = new ActiveObject ( "Microsoft.XMLDOM" );
    xmlDocument.async = false;
    xmlDocument.loadXML ( xml );

 
Share This Chapter Login with Facebook