在冗长的HTML页面上找到任何输入到搜索输入中的关键字吗



我在网上查找了一些关于我的问题的参考资料,但由于很难理解我真正需要做什么才能做到这一点。

例如,如果我想搜索关键字";必要的";或者我需要查找的任何关键字,我如何在页面中的所有文本中使用输入搜索字段来查找该关键字,并向下查找该关键字?

这需要一些JavaScript吗?

作为参考,我提供了一些我试图过滤的基本HTML代码,必要的单词是指向底部的。。。

任何想法都会有所帮助!

<div class="course-title">
<h4>Difficult Conversations: Situation, Behavior, Impact</h4>
</div>
<div class="course-info">
<p><span>Course Description:</span> The Situation/Behavior/Impact model is perfect to prepare feedback statements when it’s critical to give clear, actionable feedback. Learn more about the model, how to use, and how to manage through complicated conversations.
</p>
<p><span>Subject:</span> Personal Growth</p>
<p><span>Provider:</span>L&D</p>
<p><span>Timing:</span> 1.5 Hours</p>
<p><span>Formats Offered:</span> Virtual</p>
<p><span>Link:</span> <a href="#"></a></p>
</div>
<br><br>
<div class="course-title">
<h4>Leading Change</h4>
</div>
<div class="course-info">
<p><span>Course Description:</span> Change is a constant in innovative organizations, so it’s imperative to handle it well and adapt. In this workshop, discover what happens neurologically when change is experienced, and learn easy techniques to reduce resistance and increase inspiration, commitment, and decisive action.
</p>
<p><span>Course Type:</span> Leadership Development</p>
<p><span>Provider:</span> LL</p>
<p><span>Timing:</span> 2 Hours</p>
<p><span>Formats Offered:</span> Virtual</p>
<p><span>Accessing:</span> <a href="#"></a></p>
</div>
<br><br>
<div class="course-title">
<h4>Managing Difficult Conversations: Issue Clearing</h4>
</div>
<div class="course-info">
<p><span>Course Description:</span> Difficult conversations are a common and necessary aspect in growing a strong, connected team with a high trust climate. In this session, we'll explore Issue Clearing, a tool to help guide conversations towards open, clear, vulnerable communication.
</p>
<p><span>Course Type:</span> Leadership Development</p>
<p><span>Provider:</span> L&D</p>
<p><span>Timing:</span> 2 Hours</p>
<p><span>Formats Offered:</span> Virtual</p>
<p><span>Accessing:</span> <a href="#"></a></p>
</div>

您可以为每个部分提供自己的锚点。例如通过改变每个h4(例如这个(:

<div class="course-title">
<h4>Managing Difficult Conversations: Issue Clearing</h4>
</div>

至:

<a name="courseid123456">
<div class="course-title">
<h4>Managing Difficult Conversations: Issue Clearing</h4>
</div>
</a>

然后您可以使用超链接(<a href="#courseid123456"></a>(或使用javascript代码(如window.location = '#courseid123456';(跳转到该位置

最新更新