首页 > 解决方案 > 在 Razor 环境中获取子节点文本

问题描述

我想知道如何从子节点获得价值?我在前端使用剃须刀,想搜索主页中显示的所有内容。

剃刀

<li class="media dotted">
                                            <img class="mr-3" src="~/images/emp-list/mm.png" alt="">
                                            <div class="media-body d-flex">
                                                <div class="text">

                                                    <h5 class="mt-0 mb-1">@Html.DisplayFor(modelItem => item.Firstname) @Html.DisplayFor(modelItem => item.Lastname)</h5>
                                                    @Html.DisplayFor(modelItem => item.Title) (<span class="loc">@Html.DisplayFor(modelItem => item.Location.LocationCode)</span>)
                                                </div>
                                            </div>
                                        </li>

JS

function search() {
            var input = document.getElementsByClassName('mt-0');
            var filter = document.getElementById('employeeSearch').value.toUpperCase();
            // Loop through all list items, and hide those who don't match the search query
            for (i = 0; i < input.length; i++) {
                var currentElem = input[i];
                var currentElemChild = input[i].children[0];
                if (currentElemChild.innerHTML.toUpperCase().indexOf(filter) > -1) {
                    currentElem.style.display = "";
                }
                else {
                    currentElem.style.display = "none";
                }
            }
        }
        document.getElementById('employeeSearch').addEventListener('keyup', search());

我查看了 Chrome 调试器(图 1),可以看到我要搜索的值在我选择的类的子节点中。不知道如何访问它。感谢任何和所有的帮助,谢谢。 图1

标签: jqueryrazor

解决方案


要访问所需的子节点值:

 `var input = document.getElementsByClassName('classname');
  for (var i = 0; i < input.length; i++)
  {
     var currentElem = input[i]; 
     var currentElemChild = input[i].childNodes[0];
     currentElemChild.nodeValue
  }`

推荐阅读