كيف يمكنني إضافة ما قبل الوسم داخل رمز الوسم مع jQuery ؟

StackOverflow https://stackoverflow.com/questions/12794

سؤال

أحاول استخدام 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 بيضاء الحفاظ على الطاقة مع CSS white-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 الخاص بك.ولكن هذا الحل يجب أن تعمل.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top