convert htmlelement to string for comparison javascript

I am using a function that obtains a target element id at onclick. Example, if I click on the text element that has the id of 'help'.

var click = (e && e.target) || (event && event.srcElement);

The var click would contain the ref to the id of "help".

I want to compare the var click to the string 'help' using the if statement below.

if (click == 'about') {do something}

The comparison does not work because the var click is not a string. When I use the alert(click) to debug, it shows click as "object HTMLElement".

How would you compare whether the id 'help' is obtained from var click?

I could write out something like

if (click == document.getElementById('help')) {do something}

but that would make a long statement.

also

if the var cli开发者_运维知识库ck is document.getElementById('help'), how would I create a new var "div" as document.getElementById('helpdiv') by adding the word "div" in the id of the var click?

basically, I want to use the same function to generate dynamic responses to each element that was clicked on, and not having to create a separate function for each element.

if (click.id == 'help'){
var link = click;
var divid = click.id+'div';
var div = document.getElementById(divid);
alert (div.id); //helpdiv string
}

TIA for all your help.

---

The simplest approach is probably

if (click.id == 'help') { //do something }

---

The line:

var click = (e && e.target) || (event && event.srcElement);

is not getting the id rather the element itself, use getAttribute to get the id instead.

var id = click.getAttribute('id');
alert(id);

Or simply:

var id = click.id;
alert(id);

So your condition now becomes:

if (id == 'about') {do something}

and

if (id == document.getElementById('help')) {do something}

---

if (click["id"] != null && click["id"] == "help") { do stuff }

Addressing the last part of your question, you cannot create a new DOM object by modifying your current one like you propose in your question, and I do not understand if you want to locate an already existing object and store it in a variable, or create a new one from scratch, so :

If you want to find a new one, and you know its named like "show" + the id of your current click variable, you can easily do:

if (click["id"] != null) { 
    var found = document.getElementById("show" + click["id"]);
}

Or if you intend to create a new one :

if (click["id"] != null) { 
    var created = document.createElement("div"); // replace with whatever you need
    created["id"] = "show" + click["id"];
}

---

I think this is what you're after ...

if (click.id == 'help') {  // Test to see if click is the 'help' element
  var newEl = document.createElement('div');  // Create a new element
  newEl.id = click.id + 'div';  // Set it's id
  newEl.innerHTML = 'my help text goes here'; // Set it's content
  click.parentElement.appendChild(newEl);  // Add it to the document immediately following the 'click' element
}

Be aware that the name of an element is not the same as the element itself. Just making a new element name by appending 'div' to some existing name does not, in and of itself, create a new element. You have to explicitely create a new element object and add it into the document, as shown above.