视色,视色影院,视色影库,视色网日韩精品福利片午夜免费观看 ,亚洲精品中文字幕无码蜜桃,粉嫩虎白女毛片人体

導讀網頁的本質就是超級文本標記語言，通過結合使用其他的Web技術（如：腳本語言、公共網關接口、組件等），可以創造出功能強大的網頁。因而，超級文本標記語言是萬維網（Web）編程的基礎，也就是說萬維網是建立...

網頁的本質就是超級文本標記語言，通過結合使用其他的Web技術（如：腳本語言、公共網關接口、組件等），可以創造出功能強大的網頁。因而，超級文本標記語言是萬維網（Web）編程的基礎，也就是說萬維網是建立在超文本基礎之上的。超級文本標記語言之所以稱為超文本標記語言，是因為文本中包含了所謂“超級鏈接”點。

如何使用Backbone.js創建一個簡單的視圖？本篇文章給大家介紹的內容是關于使用Backbone.js創建一個簡單的視圖的方法，下面我們來看具體的內容。

Backbone.js

示例1：

代碼如下

創建以下HTML文件。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title></title>
  <script src="jquery-3.2.1.js"></script> 
  <script src="underscore.js"></script>
  <script src="backbone.js"></script>
  <script type="text/javascript">
    $(function () {
      var CView = Backbone.View.extend({
      });      
      var mView = new CView;
      $('#output').append(mView.el);
    });  
</script>
</head>
<body>
  <div>Header</div>
  <div id="output"></div>
  <div>Footer</div>
</body>
</html>

說明：

 var CView = Backbone.View.extend({
  });

上面的代碼成為視圖的對象。在此代碼中，沒有實現任何內容。

 var mView = new CView;
  $('#output').append(mView.el);

我們創建視圖的對象，并將視圖對象的el屬性添加到輸出id的標記元素。

運行結果

在Web瀏覽器中顯示HTML文件時，將顯示如下效果。似乎沒有顯示任何內容。

JavaScript

當確認HTML的輸出時，您可以看到div標簽被添加到id =“output”的div標簽內。雖然頁面上沒有顯示字符串，但可以確認視圖的視圖元素在頁面反映出來了。

示例2：字符串顯示的view

為可以顯示字符串而實現View。

代碼如下

編寫以下HTML文件。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
  <script src="jquery-3.2.1.js"></script> 
  <script src="underscore.js"></script>
  <script src="backbone.js"></script>
  <script type="text/javascript">
    $(function () {
      var CView = Backbone.View.extend({
        render: function () {
          this.$el.text('Hello World!');
          return this;
        }
      });
      var mView = new CView;
      $('#output').append(mView.render().el);
    });
  </script>
</head>
<body>
  <div>Header</div>
  <div id="output"></div>
  <div>Footer</div>
</body>
</html>

參考：它也適用于以下代碼。

$(function () {
      var CView = Backbone.View.extend({
              render: function () {
                        this.$el.text('Hello World!');          
                        return this;
        }
      });
      var mView = new CView;
      mView.render();
      $('#output').append(mView.el);
    });

說明：

描述render方法中的渲染實現。要輸出到HTML的標記設置為el object。el的jquery對象可以用作$ el。由于此代碼使用jquery，我們使用$ el而不是el。調用text方法并將字符串“Hello World！”設置為el對象。

var CView = Backbone.View.extend({
    render: function () {      
    this.$el.text('Hello World!');      
    return this;
    }
  });

為視圖創建一個對象。調用render（）方法進行頁面顯示。通過執行render方法，將字符串“Hello World！”設置為el屬性，并且可以準備頁面顯示內容。
然后，它在一個元素中顯示el屬性的內容，其值為id。el屬性可以引用視圖對象的el屬性，并且可以通過引用作為render（）方法的返回值返回的View對象的el屬性來獲得相同的結果。

var mView = new CView;
  $('#output').append(mView.render().el);

或者，

var mView = new CView;
  mView.render();
  $('#output').append(mView.el);

運行結果

使用Web瀏覽器顯示上述HTML文件。將顯示如下所示的效果。頁面上顯示字符串“Hello World！”。

JavaScript

當您檢查HTML的輸出時，可以看到div標簽被添加到id =“output”的div標簽內，并且字符串“Hello World！”被寫入其中。

以上就是如何使用Backbone.js創建一個簡單的視圖的詳細內容，更多請關注php中文網其它相關文章！

網站建設是一個廣義的術語，涵蓋了許多不同的技能和學科中所使用的生產和維護的網站。

溫馨提示：喜歡本站的話，請收藏一下本站！

當前位置:雨林木風下載站 > 網頁設計教程 > 詳細頁面

如何使用Backbone.js創建一個容易的視圖

本類教程下載

系統下載排行