javascript · [高亮] · [原始]

1. // 依照原始的方式是這樣設定的
2. var newElement = document.createElement(‘div’);
3. var newText = document.createTextNode(‘這是存在於在新建立標籤 div 中的文字。’);
4. newElement.id = ‘newDiv’;
5. newElement.className = ‘newDivClass’;
6. newElement.setAttribute(‘name ‘,‘newDivName’);
7. newElement.style.width = ‘300px’;
8. newElement.style.height = ‘200px’;
9. newElement.style.margin = ‘0 auto’;
10. newElement.style.border = ‘1px solid #DDD’;
11. newElement.appendChild(newText);

// 依照原始的方式是這樣設定的
var newElement = document.createElement(\'div\');
var newText = document.createTextNode(\'這是存在於在新建立標籤 div 中的文字。\');
newElement.id = \'newDiv\';
newElement.className = \'newDivClass\';
newElement.setAttribute(\'name \',\'newDivName\');
newElement.style.width = \'300px\';
newElement.style.height = \'200px\';
newElement.style.margin = \'0 auto\';
newElement.style.border = \'1px solid #DDD\';
newElement.appendChild(newText);

[高亮] · [原始] · javascript

javascript · [高亮] · [原始]

1. // 這是經過調整的 html 元素建立方式，以後每次要建立 html 元素時就呼叫它。
2. createEl = function(t, a, y, x) {
3.     var e = document.createElement(t);
4.     if (a) {
5.         for (var k in a) {
6.             if (k == ‘class’) e.className = a[k];
7.             else if (k == ‘id’) e.id = a[k];
8.             else e.setAttribute(k, a[k]);
9.         }
10.     }
11.     if (y) { for (var k in y) e.style[k] = y[k]; }
12.     if (x) { e.appendChild(document.createTextNode(x)); }
13.     return e;
14. }
15. // 現在我們開始使用 createEl 這個函式來達成與第一段程式碼相同的目的
16. var newElement = createEl(‘div’,
17.     {‘class’: ‘newDivClass’, id: ‘newDiv’, name: ‘newDivName’},
18.     {width: ‘300px’, height:‘200px’, margin:‘0 auto’, border:‘1px solid #DDD’},
19.     ‘這是存在於在新建立標籤 div 中的文字。’);

// 這是經過調整的 html 元素建立方式，以後每次要建立 html 元素時就呼叫它。
createEl = function(t, a, y, x) {
	var e = document.createElement(t);
	if (a) {
		for (var k in a) {
			if (k == \'class\') e.className = a[k];
			else if (k == \'id\') e.id = a[k];
			else e.setAttribute(k, a[k]);
        }
    }
    if (y) { for (var k in y) e.style[k] = y[k]; }
    if (x) { e.appendChild(document.createTextNode(x)); }
    return e;
}
// 現在我們開始使用 createEl 這個函式來達成與第一段程式碼相同的目的
var newElement = createEl(\'div\',
	{\'class\': \'newDivClass\', id: \'newDiv\', name: \'newDivName\'},
	{width: \'300px\', height:\'200px\', margin:\'0 auto\', border:\'1px solid #DDD\'},
	\'這是存在於在新建立標籤 div 中的文字。\');

[高亮] · [原始] · javascript