Question

让我先解释一下我要做什么。因为如果有更好的方法可以做到这一点，那么我就是耳朵（或者实际上是眼睛）。

我已经建立了一个（html）模板解析器。我所能做的是为网页编写html模板，并包含其他模板中的代码片段。像这样：

<div id="banner">
  %include ads.tmpl bannerad%
</div>

Dis将从模板文件ads.tmpl中插入一个部分（横幅）。而且ads.tmpl中的部分看起来像这样：

<bannerad>
  <div style="width:640px;height:60px">
    <img src="getbanner.cgi?type=genericad">
  </div>
</bannerad>

这样，我可以在多个页面上包含相同的横幅代码，并且如果我想更改横幅的外观/感觉，则只有一个地方可以碰到它。一切正常。

但是现在我需要能够识别请求横幅的位置。出于明显的原因，我想区分例如首页的顶部和子页面上的文本之间的某处。

我的想法是向父容器添加一些标识。像这样：

<div id="banner" data-banner_position_id="MAINPAGE_TOP">
  %include ads.tmpl bannerad%
</div>

然后在bannercode中使用内联脚本，遍历banner的parentNode，直到找到 data-banner_position_id 。像这样：

<bannerad>
  <div style="width:640px;height:60px">
    <img id="bannerimg">
  </div>
  <script>
    var el = this;
    while( el ) {
      var id = el.dataset.banner_postition_id;
      if( id ) {
        document.getElementById("bannerimg").src = "getbanner.cgi?type=genericad&id=" + id;
        break;
      } else {
        el = el.parentNode;
      }
    }
  </script>
</bannerad>

现在这显然行不通（有几个原因）。但是有办法使它起作用吗？还是有更好的方法来做到这一点？顺便说一句，页面很可能在一个页面上显示多个横幅...

查找内联脚本的容器

0 个答案: