テキストをリンクとして設定して、クリックすると関数が実行されるようにしています。現在のところ、テキストをリンクとして表示するためにgoogle.comに設定していますが、何も実行されていないようです。単なる静的テキストです。助言がありますか?
var leftDiv = document.createElement("div"); //Create left div
leftDiv.id = "left"; //Assign div id
leftDiv.setAttribute("style", "float:left; width:66.5%; line-height: 26px; text-align:left; font-size:12pt; padding-left:8px; height:26px;"); //Set div attributes
leftDiv.style.background = divColor;
a = document.createElement('a');
a.setAttribute('href', 'google.com');
user_name = a.appendChild(document.createTextNode(fullName + ' '));
leftDiv.appendChild(user_name); // Add name to left div
この例を見てください:
異なる手順を説明するコメントをコード内に追加しました。
var leftDiv = document.createElement("div"); //Create left div
leftDiv.id = "left"; //Assign div id
leftDiv.setAttribute("style", "float:left; width:66.5%; line-height: 26px; text-align:left; font-size:12pt; padding-left:8px; height:26px;"); //Set div attributes
leftDiv.style.background = "#FF0000";
a = document.createElement('a');
a.href = 'google.com'; // Insted of calling setAttribute
a.innerHTML = "Link" // <a>INNER_TEXT</a>
leftDiv.appendChild(a); // Append the link to the div
document.body.appendChild(leftDiv); // And append the div to the document body
これを試してください: http://jsfiddle.net/HknMF/5/
var divColor = "red";
var fullName = "bob";
var leftDiv = document.createElement("div"); //Create left div
leftDiv.id = "left"; //Assign div id
leftDiv.setAttribute("style", "float:left; width:66.5%; line-height: 26px; text-align:left; font-size:12pt; padding-left:8px; height:26px;"); //Set div attributes
leftDiv.style.background = divColor;
a = document.createElement('a');
a.setAttribute('href', 'google.com');
a.appendChild(document.createTextNode(fullName + ' '));
leftDiv.appendChild(a); // Add name to left div
document.body.appendChild(leftDiv);