Sets an HTML attribute on a DOM element. Use this to set IDs, data attributes, aria labels, and other HTML attributes.

Syntax

MaterialSB::SetAttribute(Element, Attribute.s, Value.s)

Parameters

Element	The DOM element to set the attribute on.
Attribute.s	The attribute name (e.g., "id", "data-target", "aria-label").
Value.s	The attribute value.

Return Value

None.

Remarks

This is commonly used to set element IDs for use with other components (like linking a sidenav to its trigger), or to add data attributes for JavaScript interaction.

Example

Procedure Main(Success)
  If Success
    ; Create navbar with sidenav trigger
    MaterialSB::Navbar(MaterialSB::#Navbar_Shadow2)
    MaterialSB::NavbarAddSidenavTrigger("main-sidenav")
    MaterialSB::NavbarAddLogo("My App")
    
    ; Create sidenav and set its ID
    mySidenav = MaterialSB::Sidenav()
    MaterialSB::SetAttribute(mySidenav, "id", "main-sidenav")
    MaterialSB::SidenavAddLink("Home", "#home", "home")
    MaterialSB::SidenavAddLink("About", "#about", "info")
    MaterialSB::Init(mySidenav, #Null)
    
    ; Main content
    MaterialSB::Row(MaterialSB::#Grid_Container)
      MaterialSB::Col(12)
        myCard = MaterialSB::Card()
        
        ; Set custom attributes
        MaterialSB::SetAttribute(myCard, "id", "main-card")
        MaterialSB::SetAttribute(myCard, "data-category", "featured")
        MaterialSB::SetAttribute(myCard, "aria-label", "Featured content card")
        
          MaterialSB::CardContent()
            MaterialSB::Append(MaterialSB::Header("Featured Content", 4))
            MaterialSB::Append(MaterialSB::Paragraph("This card has custom attributes set."))
          MaterialSB::CloseCurrentParent()
        MaterialSB::CloseCurrentParent()
      MaterialSB::CloseCurrentParent()
    MaterialSB::CloseCurrentParent()
  EndIf
EndProcedure

MaterialSB::Download(@Main())

See Also

AddClass(), SetClass(), Sidenav()