Question

jQuery提供了使用多属性选择器选择元素的可能性。因此，我尝试使用此选择器通过使用Model，Erstzulassung和Killometerstand这三个属性来选择session_start(); $_SESSION['newVal']='newVal'; var_dump($_SESSION); // session_unset(); session_write_close();元素，但我找不到正确的语法。我试过像

这样的东西

tbody

哪个不起作用。什么是正确的语法？我还在https://jsfiddle.net/herbert_hinterberger/0hswyetk/1/

创建了一个jsfiddle示例

$(["tr:first td:nth-child(3)[innerText='Corvette C5 Cabrio']"]
["tr:nth-child(2) td:nth-child(2)[innerText='EZ 03/2001']"]
["tr:nth-child(2) td:nth-child()[innerText='96.000 km']"])

Answer 1

要使用多属性选择器，模型/年/距离数据需要包含在tbody上的data-属性中，而不是HTML树下面的元素。 CSS选择器不允许根据子元素的值/属性选择父元素。

正如您在jQuery multiple attribute selector docs中看到的那样，您只能根据tbody的属性选择tbody - 而不是其子级。< / p>
您可以在第一遍中设置属性，然后根据data-model等属性选择tbody，如下面的代码所示。虽然有更多更整洁的解决方案，比如使用像AngularJS这样的框架，或者至少在JS中正确建模数据（而不是data-属性，然后再在子元素中）。

＆＃13;
＆＃13;
$(document).ready(function() { // set the tbody attributes $('tbody').each(function(index, element) { $tbody = $(element); // model the car var car = { model: $tbody.find('tr:first td:nth-child(3)').text(), erstzulassung: $tbody.find('tr:nth-child(2) td:nth-child(2)').text(), killometerstand: $tbody.find('tr:nth-child(3) td:nth-child(2)').text() }; // apply car model into the data-key attribute $.each(car, function(key, value) { // .attr() is required to create the HTML attributes, .data() would not do this $tbody.attr('data-' + key, value); }); }); // get tbody element $tbodyCorvette = $("tbody" + "[data-model='Corvette C5 Cabrio']" + "[data-erstzulassung='EZ 03/2001']" + "[data-killometerstand='96.000 km']"); $tbodyCorvette.css('outline', '1px solid blue'); console.log($tbodyCorvette); });
＆＃13;
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <body> <div class="container"> <div class="row"> <div class="col-sm-12 padding__top__10" id="row--e6s4d"> <table class="table table-bordered table-striped margin__bottom__10" id="table__cars"> <tbody data-set="0" data-url="http://127.0.0.1:8888/selfstudy/projects/ad/res/test/212302246.php"> <tr> <td rowspan="3"> <img class="img--thumbnail" src=""> </td> <td>Model</td> <td>Corvette C5 Cabrio</td> <td rowspan="2"><span class="glyphicon glyphicon-remove"></span></td> </tr> <tr> <td>Erstzulassung</td> <td>EZ 03/2001</td> </tr> <tr> <td>Killometerstand</td> <td>96.000 km</td> <td>yes</td> </tr> </tbody> <tbody data-set="1" data-url="http://127.0.0.1:8888/selfstudy/projects/ad/res/test/212302263.json"> <tr> <td rowspan="3"><img class="img--thumbnail" src=""> </td> <td>Model</td> <td>BMW X5 4.4 i aus erster Hand</td> <td rowspan="2"><span class="glyphicon glyphicon-remove"></span></td> </tr> <tr> <td>Erstzulassung</td> <td>EZ 07/2000</td> </tr> <tr> <td>Killometerstand</td> <td>226.000 km</td> <td>yes</td> </tr> </tbody> </table> </div> </div> </div> </body>
＆＃13;
＆＃13;
＆＃13;

Answer 2

您可以尝试使用XPath，因为您可以在树中返回父级，但是对于某些浏览器（例如IE9）存在问题，否则您可以尝试此功能

FindTBody()
{
var tbodyResult=undefined; 
$("tbody").each(function(){ 
var model= $(this).find("tr:first-child td");
var erstzulassung= $(this).find("tr:first-child td");
var killometerstand= $(this).find("tr:first-child td");
if(model.text()=='Corvette C5 Cabrio'
   &&erstzulassung.text()=='EZ 03/2001'
   &&killometerstand.text()=='96.000 km')
{

   tbodyResult=$(this);
   return false;//break
} 
});
return tbodyResult;
}

选择具有多个属性选择器的tbody

2 个答案: