Meteor js, body.helper function getElementsByTagName

Meteor js, body.helper function getElementsByTagName

本文关键字：function getElementsByTagName helper body js Meteor      更新时间：2023-09-26

我正在玩MeteorJS，我试图在Template.body.helpers中创建一个函数来获取数组中的img标签

if (Meteor.isClient) {
  Template.body.helpers({
    place: function(){
      var images = document.getElementsByTagName('img')
      console.log(images)
      console.log(typeof images)
      for(k in images)
        console.log(k)
      return images
  }
}

[] 我得到这个我无法访问的反对意见

对象从类型返回

控制台 （K） 显示 长度 项，以及 命名项

但是如果我使用控制台，我可以获取我的两个图像并使用它们，这与这段代码不同......

这是浏览器中的输出 [对象 HTMLCollection]

我想做的只是将我的图像收集在一个数组中，然后获取alt标签

[]
 0: img.toon
 1: img.toon
 length: 2 
proto: HTMLCollection

这是我从控制台.log（图像）获得的对象。 但是如果我尝试图像[0]，我会得到未定义

感谢您的任何帮助

所以我添加了一个带有单击事件的按钮来触发相同的代码，我按预期得到了我的图像数组...... 如果我将原始代码包装在文档加载函数中，它似乎无法运行。

事实上，你应该把你的主代码放在Template.body.onRendered里面，因为你需要等待 DOM 准备好。

如果您尝试收集alt属性值，这样的事情应该有效：

Template.body.onRendered(function() {
  var images = document.getElementsByTagName('img');
  var imagesAlts = [];
  for (var k = 0; k < images.length; k++) {
    imagesAlts.push(images[k].getAttribute('alt'));
  }
  Session.set('imagesAlts', imagesAlts);
  return;
});
Template.body.helpers({
  place: function() {
    var imagesAlts = Session.get('imagesAlts')
    console.log(imagesAlts);
    return imagesAlts;
  }
});

注意：您可以使用document.images而不是document.getElementsByTagName('img')。

相关文章：