訪問DOM

我想達到什麼：訪問DOM

亮點在p元素一些文本
（未添加/或刪除）紙徽章時值爲0
根據編號改變紙張徽章顏色

使用示例模塊：

<link rel="import" href="https://polygit2.appspot.com/components/polymer/polymer.html"> 
<link rel="import" href="https://polygit2.appspot.com/components/iron-icons/communication-icons.html"> 
<link rel="import" href="https://polygit2.appspot.com/components/paper-icon-button/paper-icon-button.html"> 
<link rel="import" href="https://polygit2.appspot.com/components/paper-badge/paper-badge.html"> 

<dom-module id="question-one"> 
    <template> 
     <template is="dom-repeat" items="{{numbers}}"> 
      <p>color one of my letters</p> 
      <paper-icon-button id="someid{{index}}" icon="communication:email"></paper-icon-button> 
      <paper-badge for="someid{{index}}" label="{{item}}"> </paper-badge> 
     </template> 
    </template> 
    <script> 
     Polymer({ 
      is: "question-one", 
      properties: { 
       numbers: { 
        type: Array, 
        value: function() { 
         return [0, 1, 2, 0, 4, 5, 0, 7, 8, 0] 
        } 
       } 
      } 
     }); </script> 
</dom-module>

與用法：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <script src="https://polygit2.appspot.com/components/webcomponentsjs/webcomponents-lite.js"></script> 
    <link rel="import" href="questions//question-one.html" /> 
</head> 
<body> 
    <question-one></question-one> 
</body> 
</html>

來源

2016-06-14 Przemysław Banaszek

作爲參考，與DOM的記錄在這裏：HTTPS：//www.polymer-project。組織/ 1.0 /文檔/ devguide /本地-DOM＃DOM的API –

添加id屬性

<p id="someId">

使用$地圖獲得參考元素

this.$.someId.innerText...

this.$不適用於動態添加的HTML或HTML內部template is="dom-if" or template is =「dom-repeat」或類似內容。

對於這樣的情況下，你可以使用this.$$(selector)所有CSS選擇器都支持，而this.$...只支持id（不含#）

來源

2016-06-14 07:30:47

回答

相關問題