كيف يمكنني إضافة ما قبل الوسم داخل رمز الوسم مع jQuery ؟
-
08-06-2019 - |
سؤال
أحاول استخدام jQuery
على شكل كتل التعليمات البرمجية ، وتحديدا إلى إضافة <pre>
الوسم داخل <code>
العلامة:
$(document).ready(function() {
$("code").wrapInner("<pre></pre>");
});
فايرفوكس ينطبق على التنسيق بشكل صحيح ، ولكن أي يضع كامل كتلة التعليمات البرمجية على سطر واحد.إن إضافة تنبيه
alert($("code").html());
أرى أن أي لديه إدراج بعض نص إضافي في قبل الوسم:
<PRE jQuery1218834632572="null">
إذا كنت إعادة تحميل الصفحة ، عدد مسج التالية التغييرات.
إذا كنت تستخدم wrap()
بدلا من wrapInner()
, إلى التفاف <pre>
خارج <code>
الوسم, كل من IE و Firefox التعامل معها بشكل صحيح.ولكن يجب أن لا <pre>
العمل داخل <code>
وكذلك ؟
أنا أفضل أن استخدام wrapInner()
لأنه لا يمكن بعد ذلك إضافة فئة CSS إلى <pre>
الوسم للتعامل مع كافة التنسيقات ، ولكن إذا كنت تستخدم wrap()
, يجب أن تضع صفحة التنسيق CSS في <pre>
العلامة النص/font التنسيق في <code>
الوسم أو فايرفوكس وإنترنت إكسبلورر كل من الاختناق.ليست صفقة ضخمة ، ولكن أود أن يبقيه بسيطة بقدر الإمكان.
وقد أي شخص آخر واجه هذا ؟ أنا في عداد المفقودين شيئا ؟
المحلول
هذا هو الفرق بين كتلة مضمنة عناصر. pre
هو كتلة مستوى العنصر.انها ليست قانونية وضعها داخل code
الوسم ، يمكن أن تحتوي فقط على المحتوى المضمن.
لأن المتصفحات في دعم كل ما المريع الوسم الحساء لأنها قد تجد على شبكة الإنترنت, فايرفوكس يحاول أن يفعل ما تقصد.أي يحدث التعامل معها بشكل مختلف ، التي على ما يرام من المواصفات ؛ السلوك في هذه الحالة هو غير محدد, لأنه يجب أن يحدث أبدا.
- يمكنك بدلا من ذلك محل على
code
العنصر معpre
?(لأن كتلة/مضمنة المسألة من الناحية الفنية التي يجب أن تعمل فقط إذا كانت العناصر داخل عنصر مع "تدفق" المحتوى, ولكن المتصفحات قد تفعل ما تريد على أي حال.) - لماذا هو
code
عنصر في المقام الأول إذا كنت تريدpre
's السلوك ؟ - يمكنك أيضا إعطاء
code
عنصرpre
's بيضاء الحفاظ على الطاقة مع CSSwhite-space: pre
, لكن على ما يبدو IE 6 فقط مرتبة الشرف في وضع الصارم.
نصائح أخرى
Btw أنا لا أعرف إذا كان هذا هو ذات الصلة ولكن قبل فئة داخل رمز فئة لا صحة في الوضع الدقيق.
هل تستخدم أحدث jQuery ؟ ماذا لو حاولت
$("code").wrapInner(document.createElement("pre"));
فهل من الأفضل أو لا يمكنك الحصول على نفس النتيجة ؟
كما markpasc ذكر قبل عنصر داخل رمز العنصر هو مسموح به في HTML.أفضل حل هو تغيير الكود الخاص بك لاستخدام <pre><code> (وهو ما يعني المنسقة مسبقا بلوك يحتوي على رمز) مباشرة في HTML الخاص بك للحصول على كتل التعليمات البرمجية.
يمكنك استخدام html() ألفه:
$('code').each(function(i,e)
{
var self = $(e);
self.html('<pre>' + self.html() + '</pre>');
});
كما ذكر أعلاه, سيكون من الأفضل تغيير html الخاص بك.ولكن هذا الحل يجب أن تعمل.