कुछ जावास्क्रिप्ट कोड डीबग करने के लिए एक HTML तत्व

Question

को हाइलाइट करने के लिए सादा जावास्क्रिप्ट कोड, मैं जावास्क्रिप्ट कोड (अधिमानतः केवल जेएस, पुस्तकालयों और निर्भरताओं के बिना) की तलाश कर रहा हूं जो एक div या span को हाइलाइट कर सकता है (शायद इसे एक div या span पर डालकर एक उज्ज्वल रंग और कुछ पारदर्शिता के साथ आकार और आकार के आकार)।

मुझे यकीन है कि यह किया जा सकता है, लेकिन मुझे नहीं पता कि कैसे शुरू किया जाए।

स्पष्टीकरण

मैं अपने तत्व के शीर्ष पर एक अर्द्ध पारदर्शी div डाल करने के लिए की जरूरत है। पृष्ठभूमि को संशोधित करने या सीमाओं को जोड़ने से मेरी मदद नहीं होगी क्योंकि मेरे तत्वों की पृष्ठभूमि और सीमाएं हैं।

Answer 1

element.style.backgroundColor = "#FDFF47"; 

# एफडीएफएफ 47 पीले रंग की एक अच्छी छाया है जो हाइलाइटिंग के लिए बिल्कुल सही लगता है।

स्पष्टीकरण के लिए संपादित करें: आप अधिक जटिल चीजें हैं। यदि आप कभी भी पिछले पृष्ठभूमि रंग को पुनर्स्थापित करना चाहते हैं, तो बस element.style.backgroundColor स्टोर करें और बाद में इसे एक्सेस करें।

Answer 2

आप एक ब्राउज़र सीएसएस outline का समर्थन करता है कि में डीबगिंग कर रहे हैं, एक सरल उपाय यह है:

myElement.style.outline = '#f00 solid 2px'; 

Answer 3

आप Firebug उपयोग करते हैं? यह डोम तत्वों की पहचान करना बहुत आसान बनाता है और जब आप डोम के माध्यम से चलते हैं तो पृष्ठ पर उन्हें हाइलाइट करेंगे।

Answer 4

function highlight(element) { 
    var div = highlight.div; // only highlight one element per page 

    if(element === null) { // remove highlight via `highlight(null)` 
     if(div.parentNode) div.parentNode.removeChild(div); 
     return; 
    } 

    var width = element.offsetWidth, 
     height = element.offsetHeight; 

    div.style.width = width + 'px'; 
    div.style.height = height + 'px'; 

    element.offsetParent.appendChild(div); 

    div.style.left = element.offsetLeft + (width - div.offsetWidth)/2 + 'px'; 
    div.style.top = element.offsetTop + (height - div.offsetHeight)/2 + 'px'; 
} 

highlight.div = document.createElement('div'); 

// set highlight styles 
with(highlight.div.style) { 
    position = 'absolute'; 
    border = '5px solid red'; 
}