1

所以我需要在 iframe 中找到一个与网页中的元素完全相同的元素(iframe 属于同一页面)。我需要用 jquery 弄清楚没有 id 的元素的索引是什么,这样我就可以在 iframe 中获得相同的元素。

编辑:如何找到元素的索引?

即对于这个html:

<div>
    <a>1</a>
    <a>2</a>
    <a>3</a>
    <a id="someA">4</a>
    <a>5</a>
    <a>6</a>
    <a>7</a>
</div>

我如何$('a')[index]从它的 jQuery 对象中找到随机锚元素之一的索引(这样我就可以做到)?

(通过做$('#someA').siblings()[Math.floor(Math.random()*6)].getIndex()

jsfiddle:http: //jsfiddle.net/YP5hQ/2/

4

2 回答 2

0

好吧,就是这样:http: //jsfiddle.net/dan_barzilay/ZB2vE/

但是您的功能全错了..我建议您将了解:.get().index()

*请注意,我没有使用任何原生 javascript。当您拥有出色的jQuery时,就没有必要了:)

**我将这一行:$(elem).html(c);改为:$(elem).html(h);因为我认为你应该这样做,如果不是简单地h改变hc

祝你好运!

于 2012-08-29T15:47:16.463 回答
0

你可以使用这个函数,它基本上需要一个元素并向后工作以查看它的确切路径。我没有将它用于您的计划,但我不明白为什么它不起作用。

function mirrorpath ( elm ) {
  /// add an indentifying segment to the path for each parent element
  var addtopath = function( elm ){
    var node = $(elm), ident = '';
    /// first off, add our nodeName to our identity
    ident += node.get(0).nodeName;
    /// if we have an id, then we are specific enough
    if ( node.attr('id') ) {
      ident += '#' + node.attr('id');
    }
    /// otherwise
    else{
      /// if we have a class, that's good :)
      if ( node.attr('class') ) {
        ident += '.' + node.attr('class').split(' ').join('.');
      }
      /// now make it more accurate with an index offset
      ident += ':eq('+node.prevAll(ident).add(node).index(node)+')';
    }
    /// add our new path segment
    path.push( ident );
  }
  /// step through the target elements parents and build our path
  var parents = $(elm).parents().get(), path = [], i = parents.length;
  while ( i-- ) { addtopath( parents[i] ); }; addtopath( elm );
  /// implode the path and return
  return path.join(' ');
}

返回的路径应该评估并在主页和 iframe 上找到您的元素 - 您所要做的就是将路径反馈回 jQuery。我不得不承认你的问题是一个相当奇怪的要求;)

附言。我没有在非常复杂的深度元素中测试过这段代码,所以在某些情况下它可能会失败......它也可以通过不使用数组进行路径存储来优化(并愚蠢地在每次迭代中重新加入...... 我刚刚更新了代码以优化这个问题)但是感谢 jQuery 和 Sizzle,它适用于我迄今为止所需要的一切。

编辑/更新

以防万一这很有用,我决定为自己修改一下代码并将其转换为 jQuery 插件。现在有一些关于实际 css 路径的生成的优化,以及当 jQuery 解析路径时的优化。

(function($){
  $.fn.cssPath = function () {
    var paths = [], addtopath = function( elm ){
      if ( elm && (elm.nodeName || (elm instanceof $ && elm.length)) ) {
        var node = $(elm), ident = String(node.get(0).nodeName).toLowerCase();
        /// if we have an id, then we are specific enough
        if ( node.attr('id') ) {
          ident += '#' + node.attr('id');
        }
        /// otherwise
        else{
          /// if we have a class, that's good :)
          if ( node.attr('class') ) {
            ident += '.' + node.attr('class').split(' ').join('.');
          };
          /// make sure there is a point to being more specific (leads to nicer paths)
          if ( node.siblings(ident).length > 0 ) {
            /// now make it more accurate with an index offset
            //ident += ':eq('+node.prevAll(ident).add(node).index(node)+')';
            ident += ':nth-child('+(node.index()+1)+')';
          };
        };
        /// add our new path segment
        return ident;
      };
    };
    this.each(function(){
      /// find the parents for this element, and add the current element to the list
      var parents = $(this).parents().get(), path = '', i = parents.unshift(this) && parents.length;
      /// build up the path string per parent
      while ( i-- ) { path += (path ? ' > ' : '') + addtopath( parents[i] ); };
      /// return the path to our paths list
      paths.push(path);
    });
    /// if one path, return string, if more return array
    return ( paths.length > 1 ? paths : paths[0] );
  }
})((typeof jQuery != undefined) && jQuery);

用法:

var path = $('#my_target_element').cssPath();

示例输出:

html > body > div#BlogArchive1 > ul.hierarchy > li.archivedate.expanded > a
于 2012-08-29T16:41:51.200 回答