建築元素與使用jQuery

嵌套內容我用下面的使用jQuery JavaScript中創建對象：建築元素與使用jQuery

var article_attrs = { 
     'class' : 'class-name', 
     click : function_name, 
     hover : function_name, 
     html : $('<h2>', { html : "Heading" }) 
    }, 
    article = $('<article>', atricle_attrs);

這個偉大的工程 - 通過設置html屬性我設置了文章的內容。

我在這一點上想做的事情是，添加一個<h2>標記和一個<div>標記，其中包括一個<footer>標記。我對這個元素的輪廓看起來像：

文章
- H2
- 格
  - 頁腳

會是什麼是做這件事的最好方法嗎？（注意這只是一個例子）。

更新：主要問題是，使用html屬性，我該如何添加多個元素？

我試圖從similar question的方法，但它並沒有在這種情況下工作：

html : [ $('<h2>', { html : "Heading" }), $('<div>', { html : "Some content" }) ]

我有此fiddle其中工程..但我還是JS沒有。我肯定錯過了一些東西。

編輯：工作與jQuery 1.8 *只有

來源

2012-10-02 Alex

'$（「」）。新增（「」）'可能做的伎倆。 – Shikyo

@Shikyo：'add（）'給jQuery選擇添加了另一個元素，我想問題是'如何將am元素追加到新創建的jQuery對象？ –

你可以簡單地寫像這樣

$('<h2></h2><div><footer></footer></div>').appendTo(article)

來源

2012-10-02 10:44:10 fcalderan

我可以，是的。不過，我喜歡使用對象表示法來控制所有屬性，並且真的想要沿着相同的路線找到一個方法。 – Alex

var $myEle = $("<article />").append(
       $("<h2 />").text("...") 
      ).append(
       $("<div />").append(
        $("<footer />") 
       ) 
      );

可以嵌套的jQuery .append()方法調用像上面創建你所需要的HTML結構。我喜歡這種方法，因爲它可以很容易地直觀地看到HTMl結構在讀取時的結果。

上面的代碼將呈現此HTML：

<article> 
    <h2>...</h2> 
    <div> 
     <footer></footer> 
    </div> 
</article>

來源

2012-10-02 15:54:31 Jasper

建築元素與使用jQuery

回答

相關問題