গুগল ক্রোম: কিভাবে জাভাস্ক্রিপ্ট / সিএসএস ফাইল সম্পাদনা করবেন এবং পুনরায় লোড না করেই পরিবর্তনগুলি দেখবেন?


0

আমি সূত্র ট্যাব মাধ্যমে পরিবর্তন করতে চান Inspect Elements এবং ব্রাউজার রিফ্রেশ ছাড়া দ্রুত একটি প্রাকদর্শন দেখতে চান।

এই কাজ করতে একটি উপায় আছে কি?

উদাহরণস্বরূপ, জাভাস্ক্রিপ্টে আমার একটি পরিবর্তনশীল আছে:

var abc = 'xyz';

কিন্তু সোর্স ট্যাবের মাধ্যমে, আমি আমার স্ক্রিপ্ট ফাইলটি পেয়েছিলাম এবং কোডটি পরিবর্তন করেছি:

var abc = 'hello world';

এখন আমি চেষ্টা করি alert(abc) তাহলে, এটি সর্বশেষ পরিবর্তন দেখাবে? আমি এই পরিবর্তন দেখতে রিফ্রেশ করতে চান না।

কোন ধরনের সম্ভাবনা বা প্লাগইন যা এই কাজ করতে পারে? কারণ কখনও কখনও এই খুব সময় সংরক্ষণ করা হয়। উদাহরণস্বরূপ, প্রত্যেকবার আমি পরীক্ষা করি কিছু মান বা প্রতিক্রিয়া দেখার জন্য আমাকে অনেক পদক্ষেপ নিতে হবে। তাই একটি ছোটখাট পরিবর্তন করার জন্য আমাকে এটি মূল ফাইলে পরিবর্তন করতে হবে এবং এটি দেখতে আবার রিফ্রেশ করতে হবে এবং এইভাবে আমাকে সর্বদা সম্পূর্ণ প্রক্রিয়াটি এড়িয়ে যেতে হবে যা অনেক সময় অপচয় করে।

উত্তর:


1

আপনি ক্রোম ব্যবহার করতে পারেন ডেভেলপার টুলস (প্রেস F12 চেপে অথবা জন্য ctrl + + পরিবর্তন + + আমি ) রানটাইম এ জাভাস্ক্রিপ্ট কোড ডিবাগ এবং ম্যানিপুলেট। তারপরে আপনি আপনার কোডে ব্রেকপয়েন্ট সেট করতে পারেন, বস্তুগুলি পরীক্ষা করতে পারেন, মানগুলির সাথে খেলতে, কনসোল থেকে কল ফাংশন এবং আরও কিছু করতে পারেন। প্রকৃতপক্ষে আপনার প্রকৃত উৎস ফাইলগুলি পরিবর্তন না করা বা উইন্ডোটি পুনরায় লোড করা ছাড়া।

নিম্নলিখিত OP এর মন্তব্য নিম্নলিখিত আপডেট করুন:

এখানে একটি নতুন ফাংশন তৈরি করার এবং দ্রুত কনসোলে কল করার একটি দ্রুত এবং নোংরা উদাহরণ রয়েছে। প্রথম লাইন ফাংশন যোগ করে (ফাংশনটি যুক্ত করে অর্থপূর্ণ কিছু ফেরত দেয় না যাতে আপনি একটি "অনির্ধারিত" ফলাফল পান)। পরবর্তীতে আমি এই নতুন ফাংশনটি কল করি যা প্রত্যাশিত একটি সতর্কতা উইন্ডো পপ আপ করে (স্ক্রিনশটটিতে দেখানো হয় না) এবং মান 17 প্রদান করে।

Enter image description here

আপনি একই কাজ করতে পারেন এবং তার বর্তমান পৃষ্ঠায় আপনার প্রকৃত পৃষ্ঠা থেকে গণনা ফেরত মানগুলি করতে পারেন। আপনি যদি আপনার কোডে ব্রেকপয়েন্ট স্থাপন করেন তবে আপনি অবজেক্ট এবং মানগুলি পরীক্ষা করতে বা রানটাইমতে তাদের পরিবর্তনগুলি কনসোল ব্যবহার করতে পারেন। BTW, এই এছাড়াও প্রযোজ্য করে DOM , তাই আপনি কনসোলের মাধ্যমে এইচটিএমএলটি ম্যানিপুলেট করতে পারেন।


আপনার বার্তার জন্য ধন্যবাদ. আমি আপনার পদ্ধতি চেষ্টা কিন্তু যে কাজ না। আমি সূত্র ট্যাব মাধ্যমে একটি ফাংশন যোগ এবং কনসোল থেকে যে ফাংশন বলা কিন্তু এটি অনির্ধারিত বলেছিলেন
user2899728

আমি একটি নমুনা স্ক্রিনশট এবং ব্যাখ্যা সঙ্গে উপরে আমার উত্তর আপডেট।
Atzmon

আমি জানি কনসোলের মাধ্যমে ফাংশন হালনাগাদ করা সম্ভব। কিন্তু আমি সোর্স ট্যাবে বিদ্যমান উৎস থেকে বা অন্য কোন ভাবে পরিবর্তন করতে চাই। কারণ কখনও কখনও আমি খুব জটিল এবং দীর্ঘ ফাংশন যে সাধারণত কনসোল আটকে যাবে না। তাই এর জন্য কোন ভাল উপায় আছে?
user2899728

হ্যাঁ। আপনার জাভাস্ক্রিপ্টটি বহিরাগত ফাইলগুলিতে রয়েছে (এইচটিএমএল স্ক্রিপ্টের অংশগুলি এম্বেড করা নয়), আপনি যে অংশটি পরিবর্তন করতে চান সেটির আগে একটি ব্রেকপয়েন্ট রাখুন, তারপরে ডিবাগারটি যে ব্রেকপয়েন্টটি হিট করলে কেবল সোর্স ট্যাবের মধ্যে উৎস পরিবর্তন করে এবং ডিবাগিং চালিয়ে যায়। আপনার নতুন কোড চালানো হবে। এটি আপনার প্রকৃত কোড ফাইলগুলি পরিবর্তন করে না তা পরামর্শ করুন (আপনি রিফ্রেশ বা Chrome থেকে প্রস্থান করার সময় আপনার পরিবর্তনগুলি শেষ হয়ে যাবে)।
Atzmon
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.