आप Google क्रोम में जावास्क्रिप्ट डीबगर कैसे लॉन्च करते हैं?


418

Google Chrome का उपयोग करते समय, मैं कुछ जावास्क्रिप्ट कोड को डीबग करना चाहता हूं। मैं उसे कैसे कर सकता हूँ?




आपको यह उपयोगी भी लग सकता है: हाउ-टू-टर्मिनेट-स्क्रिप्ट-
एग्जीक्यूट

जवाबों:


318

खिड़कियाँ: CTRL - SHIFT- Jया F12

मैक: - -J

रिंच मेनू (टूल> जावास्क्रिप्ट कंसोल) के माध्यम से भी उपलब्ध है:

JavaScript Console Menu


23
मुझे लगता है कि शॉर्टकट के बाद से CTRL-SHIFT-J में बदल गया है।
मार्टिज़न लर्मन

5
या मैक के लिए सीएमडी-शिफ्ट-जे। भगवान मैं इस <kbd>टैग प्यार करता हूँ । बहुत बुरा मैं इसे टिप्पणियों में उपयोग नहीं कर सकता।
अनुराग

11
मैक शॉर्टकट वास्तव Alt-Cmd-Jमें नवीनतम क्रोम बिल्ड पर लगता है ।
मैथ्यू बर्न

64
F12सबसे सरल तरीका है
जुआन मेंडेस

इस सवाल को देखने से मुझे समझ में आता है कि नौसिखियों के स्तर से काफी सभ्य मानकों तक मेरी जावास्क्रिप्ट कौशल में कितना सुधार हुआ है
कमल रेड्डी

399

इसे अपने स्रोत से जोड़ने का प्रयास करें:

debugger;

यह सबसे में काम करता है, अगर सभी ब्राउज़र नहीं। बस इसे अपने कोड में कहीं रखें, और यह एक ब्रेकपॉइंट की तरह काम करेगा।


यदि आप इसे भूल गए हैं, तो यह कमांड क्या है इसे कहा जाना मुश्किल है!
अहमद फ़सीह

4
यह उन कारणों से Google के लिए भी कठिन है, जो हमेशा काम नहीं करते हैं। क्या इसकी सीमाएँ हैं?
सीन

2
काम करने के लिए आपके पास क्रोम डेवलपर टूल खुला होना चाहिए (Windwos / Linux पर F12 को हिट करें, मैक पर कुंजी को न जानें, या केवल एक तत्व का निरीक्षण करें)। यदि आपके पास डेवलपर टूल खुला है, तो थोड़ी सी असावधानी यह है कि आप कैश को खाली करने के लिए रीफ़्रेश बटन को क्लिक और होल्ड कर सकते हैं।
तून81

2
@CallumRogers केवल तभी यदि आपके उपयोगकर्ता डेवलपर टूल के साथ आपकी साइट का उपयोग करते हैं, हालाँकि।
जोश एम।

3
@JoshM। कृपया ध्यान दें कि उत्पादन कोड में इसे छोड़ना बहुत बुरा है क्योंकि यह IE के कुछ संस्करणों में उन उपयोगकर्ताओं के लिए भी समस्या का कारण बनता है जिनके पास देव उपकरण नहीं हैं।
ओमेर वैन क्लोएटन

57

विंडोज और लिनक्स:

Ctrl + ShiftIडेवलपर टूल खोलने के लिए + कुंजी

Ctrl + Shift + Jडेवलपर टूल खोलने और कंसोल पर ध्यान केंद्रित करने के लिए।

Ctrl+ Shift+ Cटॉगल का निरीक्षण तत्व मोड।

मैक:

+ +Iडेवलपर टूल खोलने के लिएकुंजी

+ +Jडेवलपर टूल खोलने और कंसोल पर ध्यान केंद्रित करने के लिए।

+ +Cटॉगल का निरीक्षण तत्व मोड।

स्रोत

अन्य शॉर्टकट


3
मैक पर, shorcut निरीक्षण तत्व मोड टॉगल करने के लिए शिफ्ट है Shift C (Shift - कमांड - C)
रॉबर्टो बैरोस

15

F12जावास्क्रिप्ट डीबगर को लॉन्च करने के लिए क्रोम ब्राउज़र में फ़ंक्शन कुंजी दबाएं और फिर "लिपियों" पर क्लिक करें।

शीर्ष पर जावास्क्रिप्ट फ़ाइल चुनें और ब्रेकपॉइंट को जावास्क्रिप्ट कोड के लिए डीबगर में रखें।


3
F12 Chrome 23.0.1246.0 देव-मी के साथ मेरे विंडोज 7 सिस्टम पर डिबगर को खोलना प्रतीत नहीं होता है।
खगोलविज्ञानी

F12 के लिए +1, यह IE, FF, Edge के लिए भी काम करता है। Emacs को मुख्य संयोजनों की तरह सीखने की आवश्यकता नहीं है। मैक को छोड़कर।
सीसाबा तोथ


6

Mac पर Chrome 8.0.552 में, आप मेनू के तहत इस पा सकते हैं देखें / डेवलपर / JavaScript कंसोल ... या आप उपयोग कर सकते हैं Alt+ CMD+ J



2

Shift+ Control+ Iडेवलपर टूल विंडो खोलता है। नीचे से बाईं ओर की दूसरी छवि (जो निम्नलिखित की तरह दिखती है) आपके लिए कंसोल को खोलेगी / छिपाएगी:

कंसोल दिखाएं


2

समर्पित 'कंसोल' पैनल खोलने के लिए, या तो:

  • कीबोर्ड शॉर्टकट का उपयोग करें
    • विंडोज और लिनक्स पर: Ctrl+ Shift+J
    • मैक पर: Cmd+ Option+J
  • Chrome मेनू आइकन, मेनू -> अधिक उपकरण -> जावास्क्रिप्ट कंसोल चुनें । या यदि Chrome डेवलपर टूल पहले से खुले हैं, pressतो 'कंसोल' टैब।

कृपया यहाँ देखें


1

मैक उपयोगकर्ताओं के लिए, Google Chrome -> मेनू दृश्य -> डेवलपर -> जावास्क्रिप्ट कंसोल पर जाएं

स्क्रीनशॉट


1

अब google chrome ने नया फीचर पेश किया है। इस सुविधा का उपयोग करके आप क्रोम ब्राउज़ में कोड को संपादित कर सकते हैं। (कोड स्थान पर स्थायी परिवर्तन)

उसके लिए F12 -> स्रोत टैब - (दाईं ओर) -> फ़ाइल सिस्टम - इसके लिए कृपया अपना कोड स्थान चुनें। और फिर क्रोम ब्राउज़र आपसे अनुमति मांगेगा और उसके बाद कोड हरे रंग के साथ डूब जाएगा। और आप अपने कोड को संशोधित कर सकते हैं और यह आपको कोड स्थान पर भी प्रतिबिंबित करेगा (इसका मतलब है कि यह स्थायी परिवर्तन होगा)

धन्यवाद



0

F12 डेवलपर पैनल खोलता है

CTRL + SHIFT + C होवर-टू-इंस्पेक्ट टूल को खोलेगा जहाँ यह तत्वों को हॉवर के रूप में हाइलाइट करता है और आप एलिमेंट्स टैब में इसे दिखाने के लिए क्लिक कर सकते हैं।

CTRL + SHIFT + I कंसोल टैब के साथ डेवलपर पैनल खोलता है

राइट-क्लिक> निरीक्षण किसी भी तत्व पर राइट क्लिक करें, और डेवलपर पैनल के तत्वों टैब में इसे चुनने के लिए "निरीक्षण" पर क्लिक करें।

ESC यदि आप राइट-क्लिक करते हैं और तत्व या समान का निरीक्षण करते हैं और DOM को देख रहे "एलिमेंट्स" टैब में समाप्त होते हैं, तो आप कंसोल को ऊपर और नीचे टॉगल करने के लिए ESC को दबा सकते हैं , जो दोनों का उपयोग करने का एक अच्छा तरीका हो सकता है।



-5

क्रोम में कंसोल से, आप कर सकते हैं console.log(data_to_be_displayed)


3
इससे कंसोल ओपन नहीं होगा। यह केवल कंसोल पर लॉग इन करेगा।
शज
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.