Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/454.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript DOM遍历和CSS选择器_Javascript_Dom_Css Selectors - Fatal编程技术网

Javascript DOM遍历和CSS选择器

Javascript DOM遍历和CSS选择器,javascript,dom,css-selectors,Javascript,Dom,Css Selectors,情景 我正在开发一个现有的web实现。我正在添加一些逻辑客户端来跟踪用户体验 约束条件 不幸的是,当前的实现缺少一些有用的Id属性。我不允许插入它们,也不允许修改现有的DOM结构 接近 因此,我几乎不需要利用Javascript DOM遍历方法: var gameLink = eventSource.parentNode.parentNode.querySelector('a.arrow-label'); 出于设计的考虑,我将尽我所能将所有内容放在一个配置JSON对象中。因此,我可以将实现逻辑

情景

我正在开发一个现有的web实现。我正在添加一些逻辑客户端来跟踪用户体验

约束条件

不幸的是,当前的实现缺少一些有用的Id属性。我不允许插入它们,也不允许修改现有的DOM结构

接近

因此,我几乎不需要利用Javascript DOM遍历方法:

var gameLink = eventSource.parentNode.parentNode.querySelector('a.arrow-label');
出于设计的考虑,我将尽我所能将所有内容放在一个配置JSON对象中。因此,我可以将实现逻辑与任何可变逻辑分开:

gt.conf = {
  pages: {
    'homepage':'Home page'
    ,'help':'Supporto utente'
  }
  , user: {
    'loggedIn':'autenticato'
    'registered':'registrato'
  }
};
现在,我很乐意在配置对象中添加选择器:

gt.conf = {
  /* ... */
  , selectors: {
    'gameLink':'a.arrow-label'
  }
}
以便:

var gameLink = eventSource.parentNode.parentNode.querySelector(gt.conf.selectors.gameLink);
但我也会在配置中存储代码中可怕的parentNode链

问题:

有没有办法将“parentNode”链存储为字符串并使用它执行DOM遍历?

基于注释构建:

然后:


也许您可以只存储应用parentNode的次数?是的,是可用选项之一
gt.conf ={
   /* ... */
    traverseUp: 2
}
var i = gt.conf.traverseUp,
    scope = eventSource;
while(i > 0){
    scope = scope.parentNode;
    i--;
}
var gameLink = scope.querySelector(gt.conf.selectors.gameLink);