新的'网络”准备报告

一场偶然的研究绕行导致了怀旧的旅行记忆小道和现代网络准备工具的创建。在研究少量CSS的AT规则时，单击导致了有关“ HTML5 Reshines Hacking”的博客文章，该网站向2010- 2013年的浏览器提供了浏览器支持。这引发了一个想法：一种新的“ Web Reverminess 2025”工具。

结果是Webreadiness.com，网站跟踪浏览器支持，以激发即将到来的HTML和CSS功能。目前，人口稀少，但计划是观看支持的彩虹随着时间的流逝而增长。

该项目是学习机会。数据来自Web功能API（ https://www.php.cn/link/link/B305C4982512D2529AD05EE542A18133 ），绕过更麻烦的<baseline-status></baseline-status>Web组件，尽管作者最初考虑使用它。使用Web组件“ Baselineray”显示每个功能的支持，旨在获取和显示浏览器兼容性数据。下面的代码段说明了组件的基本结构：

类BASELINERAY扩展了HTMlelemt {
  constructor（）{
    极好的（）;
  }

  静态GET观察到tributes（）{
    返回[“数据功能”];
  }

  attributechangedcallback（属性，oldValue，newValue）{
    if（oldValue！== newValue）{
      此[属性] = newValue;
    }
  }

  异步#fetchfeature（端点，featureid）{
    //获取功能功能
  }

  async connectedCallback（）{
    //致电FetchFeature和输出列表
  }
}

customelements.define（“基线射线”，基线）;

动画，使用Web动画API，增强了用户体验。作者最初考虑了相同的文档视图过渡，但由于浏览器默认过渡和文档的挑战，因此选择了Web Animation API。巧妙地使用sibling-index()和sibling-count() （与javaScript一起填充）可以动态定位和旋转彩虹中的每个射线。最后，交互式浏览器字幕突出显示使用CSS :has()选择器，消除了对JavaScript的需求。

webreadiness.com的未来涉及监视功能支持并每年拍摄快照。作者鼓励对缺失功能的反馈和建议。该项目旨在成为跟踪Web技术发展的宝贵资源。查看报告以获取更多详细信息！

以上是新的'网络”准备报告的详细内容。更多信息请关注PHP中文网其他相关文章！