تحقيق وظيفة قطع النص باستخدام js

تم استخدام jq لإنشاء وظيفة قطع النص من قبل، ولكن لتحقيق هذه الوظيفة في مشروع لا يستخدم jq يبدو معقدًا جدًا. هنا أقوم بكتابة وظيفة قطع النص باستخدام js. دعونا نبدأ بالكود.　

HTML (اختبار):　

<div>أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox</div>
<div limit="10">أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox</div>
<div limit="5">أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox</div>
<div limit="2">أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox</div>
<div>أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox</div>
<div limit="20">أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox</div>
<div limit="100">أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox</div>
<div>أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox أنا pox</div> 

JS:　

var limit = [];
    var Text = [];
    var Pox = document.getElementsByTagName('*');
    for(var i = 0; i < Pox.length; i++){
     if(Pox[i].getAttribute("limit")){
      limit[i] = Pox[i].getAttribute("limit");
      Text[i] = Pox[i].innerHTML;
      if(limit[i] < Text[i].length){
       Pox[i].innerHTML=Text[i].substring(0,limit[i]) + "...";
      }
     }
    } 

هنا يتم استخدام getElementsByTagName للحصول على جميع العناصر التحقق من الدوران، إذا كان (Pox[i].getAttribute("limit")) يبحث عن العناصر التي تحتوي على الخاصية المخصصة "limit"، ثم يتم الحصول على قيمة الخاصية المخصصة "limit" لكل عنصر وإضافتها إلى مصفوفة limit، وإدخال النصوص الخاصة بالعناصر إلى مصفوفة Text، ثم مقارنة القيم التي يجب قطعها مع طول النص، والقيام بالقطع.　

جميع الكودات JS، هنا الكود الذاتي الاتصال:}

<script type="text/javascript">
 window.onload = function(){
  (function limit(){
   var limit = [];
    var Text = [];
    var Pox = document.getElementsByTagName('*');
    for(var i = 0; i < Pox.length; i++){
     if(Pox[i].getAttribute("limit")){
      limit[i] = Pox[i].getAttribute("limit");
      Text[i] = Pox[i].innerHTML;
      if(limit[i] < Text[i].length){
      Pox[i].innerHTML=Text[i].substring(0,limit[i]) + "...";
      }
     }
    } 
   }());
   }
</script> 

صورة النمذجة:

هذا هو نهاية محتويات هذا المقال، نأمل أن تكون قد ساعدتكم في التعلم، ونأمل أن تدعموا دليل التعليمات بشكل أكبر.

البيان: محتويات هذا المقال تم جمعها من الإنترنت، وتعود ملكية المحتويات إلى صاحبها، تم جمع المحتويات من قبل المستخدمين عبر الإنترنت وتم تحميلها بشكل مستقل، ويحمل هذا الموقع حقوق الملكية، لم يتم تعديل المحتويات بشكل يدوي، ولا يتحمل الموقع أي مسؤولية قانونية تتعلق بذلك. إذا كنت قد وجدت محتوى يشتبه في انتهاك حقوق النسخ، فلا تتردد في إرسال بريد إلكتروني إلى: notice#oldtoolbag.com (عند إرسال البريد الإلكتروني، يرجى استبدال # ب @) لتقديم الشكوى، وقدم الأدلة ذات الصلة، وإذا تم التحقق من ذلك، فإن هذا الموقع سيزيل محتويات الانتهاك فوراً.