JavaScript - 創建元素並設置屬性

我有這些函數來創建元素並更改它們的屬性。你能給我一個關於如何修改它們的建議嗎？JavaScript - 創建元素並設置屬性

function create(elem) { 
return document.createElementNS ? document.createElementNS("http://www.w3.org/1999/ xhtml", elem) : document.createElement(elem); 
} 

function attr(elem, name, value) { 
if (!name || name.constructor != String) return ""; 
name = {"for": "htmlFor", "class": "className"}[name] || name; 
if (typeof value != "undefined") { 
    elem[name] = value; 
    if (elem.setAttribute) elem.setAttribute(name, value); 
} 
return elem[name] || elem.getAttribute(name) || ""; 
}

我想是這樣的創建（ '格'，{ '身份證'： '測試'， '類'： '平穩'}）;

function create(elem, attr) { 
if (!attr) return document.createElementNS ? document.createElementNS("http://www.w3.org/1999/xhtml", elem) : document.createElement(elem); 
if (attr) { 
    var el = document.createElementNS ? document.createElementNS("http://www.w3.org/1999/xhtml", elem) : document.createElement(elem); 
    for (var i = 0; i < attr.length; i++) { 
    attr(el, name[i], value[i]); 
    } 
    return el; 
}

}

請幫=]

來源

2010-06-25 Denis Bobrovnikov

我建議像jQuery JavaScript框架。他們已經實現了這個功能。

$("<div/>", { 
    "class": "test", 
    text: "Click me!", 
    click: function(){ 
     $(this).toggleClass("test"); 
    } 
}).appendTo("body");

來源

2010-06-25 12:02:30

我認爲雖然這並不是一般的不好的建議，但這個人似乎正在建立一個他自己的小框架，可能要從經驗中學習。 – Pointy 2010-06-25 12:05:24

您無法通過這樣一個對象迭代：

for (var k in attrs) { 
    if (attr.hasOwnProperty(k)) 
    attr(el, k, attrs[k]); 
}

請注意，我改變了你的「ATTR」變量「ATTRS」，因此，它不隱藏「ATTR」功能你已經創建。此外，在您的「attr」功能中，更改「undefined」測試：

if (typeof value !== undefined)

會更安全一些。使用「==」和「！=」進行比較會嘗試進行類型轉換，如果您只是檢查undefined，則不需要該轉換。

來源

2010-06-25 12:04:02 Pointy

一個忠告：我個人更喜歡jquery的方式，因爲你可以直接將css和事件添加到元素，並通過var名稱而不是id來引用對象，但是......使用這種方法來創建輸入元素，即ie8不允許你設置類型屬性，所以要小心創建按鈕，文本框等，例如，jquery會拋出「類型屬性不能改變」的錯誤。

如果代碼要在ie9之前的瀏覽器中使用，最好使用：document.createElement來代替以提高兼容性。

來源

2013-04-30 10:34:06

JavaScript - 創建元素並設置屬性

回答

相關問題