ارزدیجیتال
حراجی دامنه های ویژهمشاهده





پلتفرم رپورتاژ آگهی و بک لینک تسمینو
تبلیغات
تبلیغات
تبلیغات تبلیغات
تبلیغات تبلیغات

اسکریپت جی کوئری جستجوگر سریع صفحات هلمز

جی کوئری , متفرقه

شاید برای شما هم پیش اومده باشه که در یک صفحه شلوغ و پر از متن های مختلف، دنبال جمله خاصی بودید و در نهایت به واسطه جستجو مرورگرتون  (Ctrl+F) متن مورد نظر رو در صفحه پیدا کردید. حالا در برخی موارد این روش کاربرد چندانی نداره (مثلا در موبایل) و یا اینکه برخی از کاربران اینترنتی آشنایی چندانی با قابلیت های مرورگرشون ندارند و از طرفی جستجو در میان کوئری های سایت هم بار مضاعفی برای سرور شما خواهد داشت… پس حالا میفرمایید چیکار کنیم؟!؟

 

خب، ساده است! کافیه که این موضوع رو به دستان پر توان هلمز بسپرید! هلمز، اسکریپتی سبک و ساده است که بدون نیاز به کتابخانه جی کوئری، کلیه متن های صفحه رو در سمت کاربر پردازش میکنه و نتیجه نهایی با حذف موارد اضافه به نمایش در میاد… همچنین، پیاده سازی هلمز هم بسیار ساده است و در چند قدم ساده میتونید این اسکریپت رو در صفحتون قرار بدید.

 

اسکریپت جی کوئری جستجوگر سریع صفحات هلمز

 

قدم اول:

اولین کاری که باید انجام بدید فراخوانی اسکریپت holmes.js در صفحه است که میتونید این فایل رو در صفحه گیتهاب پلاگین دانلود کنید و یا از شیوه نصب bower یا npm استفاده کنید که نمونه دستور npm به صورت زیر قابل استفاده است:

 

$ npm install --save holmes.js

 

قدم دوم:
در مرحله دوم باید طرفین فاعل و مفعول رو مشخص کنیم! فاعل همون جستجو کننده است که باید یک فیلد input باشه و مفعول هم در واقع بخشیه که فاعل اونجا رو مورد جستجوی خودش قرار میده. به عنوان مثال:

 

<div class="search">
<input type="search" placeholder="کلمه را وارد کنید" required>
</div>
<div class="results">
<blockquote>
سلام، امروز با یک آموزش جدید از بیست اسکریپت در خدمت دوستان عزیز هستیم. در این...
</blockquote>
<blockquote>
بیست اسکریپت بزرگترین مرجع دانلود اسکریپت در ایران . وبسایت...
</blockquote>
</div>

 

قدم سوم:
آخرین مرحله کار هم فراخوانی تابع اصلی homles در صفحه است که دو کلید مهم input  و find به ترتیب با سلکتورهای فاعل و مفعول مقدار دهی میشن. (البته این تابع آپشن های دیگه ای هم داره که میتونید جزئیات بیشترش رو در صفحه گیتهاب پلاگین مشاهده کنید)

 

holmes({
  input: '.search input', // default: input[type=search]
  find: '.results div' // querySelectorAll that matches each of the results individually
})

 

موفق باشید

این محتوا چقدر براتون مفید بود؟

از ۱ تا ۵ امتیاز بدید.

میانگین رتبه 0 / 5. تعداد رای : 0

تا حالا کسی رای نداده! اولین نفر شما باشید.

دانلود

هاست ارزان، لایت اسپید، سرور مجازی منطبق با اسکریپت های 20script کلیک کنید >

خرید ارز
مطلب مفیدی بود ؟
نویسنده : تیم محتوای 20اسکریپت 0 جی کوئری , متفرقه
لینک کوتاه مطلب : https://www.20script.ir/?p=28700
کلمات کلیدی پست :
مطالب مرتبط
13,385اسکریپت ایجاد مجله خبری آنلاین Buzzy نسخه 1.4 تاریخ : 2016/08/8
13,852اسکریپت فروشگاه ساز و چند فروشندگی E-Commerce PRO تاریخ : 2018/08/3
15,026اسکریپت اشتراک گذاری موسیقی phpSound تاریخ : 2014/10/9
15,482اسکریپت 9 سبک خاص آیکون های متحرک شبکه های اجتماعی تاریخ : 2016/07/12
16,604اسکریپت ایجاد سایت نیازمندی ها و ثبت آگهی LaraClassified نسخه 1.4.4 تاریخ : 2016/09/19
9,331اسکریپت اشتراک گذاری ایمن فایل ها بین کاربری ProjectSend تاریخ : 2016/03/1
19,553کد ساعت بسیار زیبای جی کوئری تاریخ : 2018/02/27
14,801اسکریپت مدیریت صورت حساب Siwapp تاریخ : 2017/06/28
9,178موبایل های سه بعدی جیکوئری تاریخ : 2013/11/14
9,855منوی حرفه ای به صورت جی کوئری تاریخ : 2013/10/25
17,909اسکریپت کیبورد مجازی فارسی تاریخ : 2015/10/11
9,397راه اندازی وب سایت مخصوص موبایل با اسکریپت BK Mobile CMS تاریخ : 2015/10/25
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت هاقالب عشق بین انگشت ها
قالب دخترونه و آرایشقالب دخترونه و آرایش
قالب زیبای ماشینقالب زیبای ماشین
قالب فانتزی و طنز چِشمقالب فانتزی و طنز چِشم
قالب دختر رویاییقالب دختر رویایی
قالب وبلاگ دکوراسیونقالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درختقالب وبلاگ کلبه و درخت
قالب دختر زیباقالب دختر زیبا
قالب پسرونه غمگینقالب پسرونه غمگین
قالب عاشقانه قلبقالب عاشقانه قلب