微件:CharacterAttributes:修订间差异

无编辑摘要
标签已被回退
无编辑摘要
标签手工回退
第1行: 第1行:
<includeonly>
<includeonly>
<div>
<div>
   <label for="levelSlider">{{{1}}}角色等级: <span id="currentLevel">1</span></label>
   <label for="levelSlider">角色等级: <span id="currentLevel">1</span></label>
   <input type="range" id="levelSlider" min="1" max="100" value="1">
   <input type="range" id="levelSlider" min="1" max="100" value="1">
</div>
</div>
第12行: 第12行:
<script>
<script>
document.addEventListener('DOMContentLoaded', function() {
document.addEventListener('DOMContentLoaded', function() {
   const characterName = '{{{1}}}';  // 从模板参数中获取角色名
   const data = {
  console.log('Character Name:', characterName);
    "levels": {
      "1": {"health": 100, "attack": 10, "defense": 5},
      "2": {"health": 120, "attack": 12, "defense": 6},
      "3": {"health": 140, "attack": 14, "defense": 7},
      "100": {"health": 1000, "attack": 100, "defense": 50}
    }
  };


   // 构造API请求URL
   const levelSlider = document.getElementById('levelSlider');
   const apiUrl = `/w/api.php?action=query&prop=revisions&rvprop=content&format=json&titles=Data:${characterName}/属性`;
   const currentLevel = document.getElementById('currentLevel');
  const health = document.getElementById('health');
  const attack = document.getElementById('attack');
  const defense = document.getElementById('defense');


   fetch(apiUrl)
   levelSlider.addEventListener('input', function() {
    .then(response => response.json())
     const level = levelSlider.value;
     .then(data => {
    currentLevel.textContent = level;
      // 提取页面内容
      const pages = data.query.pages;
      const page = pages[Object.keys(pages)[0]];
      const content = page.revisions[0]['*'];
      console.log('Page Content:', content);


      // 解析JSON内容
    const attributes = data.levels[level];
      let jsonData;
    if (attributes) {
      try {
      health.textContent = attributes.health;
        jsonData = JSON.parse(content);
      attack.textContent = attributes.attack;
        console.log('Parsed JSON:', jsonData);
      defense.textContent = attributes.defense;
      } catch (e) {
    }
        console.error('Error parsing JSON:', e);
  });
        return;
      }
 
      const levelSlider = document.getElementById('levelSlider');
      const currentLevel = document.getElementById('currentLevel');
      const health = document.getElementById('health');
      const attack = document.getElementById('attack');
      const defense = document.getElementById('defense');
 
      levelSlider.addEventListener('input', function() {
        const level = levelSlider.value;
        currentLevel.textContent = level;
 
        const attributes = jsonData.levels[level];
        if (attributes) {
          health.textContent = attributes.health;
          attack.textContent = attributes.attack;
          defense.textContent = attributes.defense;
        }
      });
    })
    .catch(error => console.error('Error loading data:', error));
});
});
</script>
</script>
</includeonly>
</includeonly>

2024年6月26日 (三) 21:10的版本