How to get ID from CSS to Javascript without getElementByID?

Question

I have a basic question involving CSS and JavaScript.

I have a page with several DIVs, each one with an unique ID taken from a mysql database. When a user clicks on a certain DIV, I want that one to disappear from the page. Because everything it's dynamic my solution was to pass the id as a variable to the function. The problem is I don't know how use that id. I need something to replace document.getElementById().

JS:

function flashout(the_unique_id){
document.getElementByID(???).style.display = "";
}

HTML/CSS:

<div id="394" onclick="flashout(394)">...</div>
<div id="723" onclick="flashout(723)">...</div>

And id can't be a number: ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods ("."). — Irvin Dominin
– Irvin Dominin, Commented Aug 26, 2013 at 21:37
@Edward: Those were HTML4 restrictions. Anyway, I'm pretty sure JavaScript implementations still successfully fetched by numeric id. — user2437417
– user2437417, Commented Aug 26, 2013 at 21:38

Comfortably Numb · Accepted Answer · 2013-08-26 21:35:49Z

5

The ID should work but you don't have to use it. Just pass this as a parameter:

<div id="394" onclick="flashout(this)">...</div>
<div id="723" onclick="flashout(this)">...</div>

and use that param as a element itself instead of string ID:

function flashout(div_element){
   div_element.style.display = "none";
}

Oh and if you want DIV to disappear - set style.display to "none", not "".

answered Aug 26, 2013 at 21:35

Comfortably Numb

39.9k17 gold badges82 silver badges147 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

j0sh1e · Accepted Answer · 2013-08-26 21:40:27Z

1

I think I understand what you are looking for.

When you you are establishing a function and its parameters in JavaScript, the parameter can be used like a variable while defining the function. Try this

HTML:

<div id="394" onclick="flashout(394)">...</div>
<div id="723" onclick="flashout(723)">...</div>

JS:

function flashout(unique_id){
  document.getElementByID(unique_id).style.display = "";
}

answered Aug 26, 2013 at 21:40

j0sh1e

2964 silver badges11 bronze badges

Collectives™ on Stack Overflow

How to get ID from CSS to Javascript without getElementByID?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related