javascript:访问表中的元素

时间:2010-06-14 13:27:18

标签: javascript

我对javascript很新。我有这个样本表。我希望能够获得“http://www.msn.com”,但未能这样做。我该怎么做?

提前

thanx

Ĵ

<body>
    <div id="tableContainer">
        <table width="100%">
            <thead>
                <tr>
                    <th width="16%" >  </th >
                    <th width="62%"> Otras acciones</th >
                    <th class="sort" width="2%"> Código certificado</th>
                    <th class="sort" > Descripción</th>
                </tr>
            </thead>
            <tbody> 
                <tr>
                    <td class="iconos" >  
                        <span class="sigAccion">                
                            <a href="#" class="sigIcnHref" title="Duplicar" />
                            <span class=" btnDuplicar">
                            </span></a>
                            <a href="http://www.msn.com" class="sigIcnHref" title="Modificar" />
                           <span class=" btnModificar">
                            </span></a>
                            </span> </td>   
              <td  class="AccionRegistro">
                <ul>
                  <li>
                  <a href="#" >Docència </a></li>
                  <li>
                  <a href="#" >Matrícula(S) </a></li>
                  <li>
                  <a href="#" >Plans(1) </a></li>
                  <li>
                  <a href="#" >Professors(1)  </a></li>
                  <li>
                  <a href="#" >Horaris(9)  </a></li>
                  <li>
                  <a href="#" >HorarisProfessors(1) </a></li>
                </ul></td> 
              <td > <sup>2</sup>CAMD</td>
              <td> Cert. Alumno Matriculado Ext.</td>
            </tr>          
            </tbody>  
        </table>
    </div>
</body>

4 个答案:

答案 0 :(得分:2)

直接javascript非常简单。

获取对树上方a元素上方的已知元素的引用 获取已知元素下的a元素列表 将href属性与您知道的值匹配

var anchor = null;
var container;
var items;

container = document.getElementById('tableContainer');
items = container.getElementsByTagName('a');

for (var j = 0; j < items.length; j++) {
    if (items[j].href === 'http://www.msn.com') {
        anchor = items[j];
        break;
    }
}

如果您可以直接引用table元素,然后从那里获取a元素列表,那会更好,但如果这是table中唯一的tableContainer没关系。

为了检查href属性的已知值,我通常使用不区分大小写的正则表达式,但这对你的情况应该没问题。

答案 1 :(得分:0)

使用像jQuery这样的框架非常简单:

var href = $('#tableContainer .iconos a[title=Modificar]').attr('href');

使用普通的Javascript,如果你不能简单地在元素中添加一个id来使它更容易找到它,那就更复杂了。例如,您可以查看页面中的所有链接:

var href;
var links = document.links;
for (var i = 0; i < links.length; i++) {
  if (links[i].title == 'Modificar') href = links[i].href;
}

答案 2 :(得分:0)

你也可以使用jQuery

来做到这一点
$('#tableContainer a').each(function() {    
    if (this.href == 'http://www.msn.com'){
           // Do something like  $(this).hide(); 
    }
    else {
       // Do somthing like $(this).show();

          }
        });

这是JSFiddle

的示例

答案 3 :(得分:-1)

如果结构总是这样,Prototype的代码将如下所示:

var allLinks = $$('#tableConatiner tbody tr td span a');
var msnLInk = allLinks[1].href;

您还可以将jQuery与类似的选择器或甚至纯JS一起使用,这需要一些额外的选择。但是使用id属性(例如“msnLink”),您可以使用直接选择来获取它:

var msnLink = $('msnLink').href;

我可以用ID扩展代码吗?

编辑:如果标题或类别是唯一且始终相同,您还可以使用以下行之一:

var msnLink = $$('a[class="sigIcnHref"]').first().href;
var msnLink = $$('a[title="Modificar"]').first().href;

您能否在选择结构后向我们提供有关结构以及您想要对元素做些什么的更多信息?