使用搜索表单搜索 HTML DOM 树

Question

我有一个像字典一样的页面。我使用 Umbraco 生成页面中的单词，每个单词都有描述。它是营养词，所以它像 'salt'、'vitamin B12' 等。现在，我必须创建一个搜索栏来搜索这些词并将 return 结果，我需要它是模糊的.我不需要按说使用 Umbraco，但到目前为止我正在使用 MVC 和剃刀进行项目。我不知道如何让它搜索页面。

<div class="row">

            @foreach (var item in Model.Content.Descendants("lekseisDiatrofikouLeksikou"))
            {





                <div class="col-sm-3 styled">
                    <button data-id="@id" type="button" class="btn">
                        @(item.GetPropertyValue<string>("leksi"))
                    </button>
                    <div id="@("button-wrapper"+id)" class="col-xs-12 styled2 text-center nopadding">
                        @Html.Raw(item.GetPropertyValue<string>("perigrafiLeksis"))
                    </div>
                </div>
                id++;
            }

        </div>

这是我用来生成字典中单词的循环。这会为每个单词生成一个 bootstrap col-sm-3。我真的不知道如何搜索这些词。我应该在 HTML 中搜索 DOM 树吗？

Answer 1

没有！当然 :) 在 Umbraco 中，你有 Examine / Lucene 索引来让你快速和简单的搜索功能。它旨在使搜索更容易。您仍然可以在页面后代中执行此操作，但在这种情况下检查会好得多。

在此处查看介绍和详细信息：https://our.umbraco.org/documentation/reference/searching/examine/ and then go to https://our.umbraco.org/documentation/reference/searching/examine/overview-explanation 查看如何使用 Fluent API 并构建查询，您可以使用该查询仅在您感兴趣的节点内进行搜索。

它可能看起来像这样：

var umbracoHelper = new UmbracoHelper(UmbracoContext.Current);
var searchCriteria = ExamineManager.Instance.CreateSearchCriteria();

var valuesToSearch = new string[] { "salt", "vitamin" };

searchCriteria.NodeTypeAlias("AliasOfYourDictionaryItemDocumentType");
searchCriteria.GroupedOr(new List<string>() { "propertyAliasInWhichWeWantToSearch" }, valuesToSearch);

var results = umbracoHelper.TypedSearch(searchCriteria);

您将获得从索引搜索返回的项目列表。它未经测试，但希望能为您指明正确的方向。编码愉快！

使用搜索表单搜索 HTML DOM 树

Searching HTML DOM tree with search form

html

model-view-controller

dom

umbraco