জকিউরি ব্যবহার করে কেবল একটি ডিভের ভিতরেই পাঠ্য প্রতিস্থাপন করুন


104

আমার মত একটি ডিভ আছে:

<div id="one">
       <div class="first"></div>
       "Hi I am text"
       <div class="second"></div>
       <div class="third"></div>
</div>

আমি jquery ব্যবহার করে "হাই আমি পাঠ্য" থেকে "হাই আমি প্রতিস্থাপন করছি" তে কেবল পাঠ্যটি পরিবর্তন করার চেষ্টা করছি। এটি সহজ হতে পারে তবে আমি এটি করতে সক্ষম নই।

$('#one').text('')পুরো ডিভিটি খালি খালি ব্যবহার করা #One


এটা একটা করতে সহায়ক হতে পারে বেহালার
Inkbug

$ ('# এক') ব্যবহার করুন। সন্ধান করুন ('প্রথম')। পাঠ্য ('হাই আমি প্রতিস্থাপন করছি'); $ ('# এক') এর পরিবর্তে পাঠ্য (); অথবা আপনি সরাসরি উপাদানটি অ্যাক্সেস করতে এবং text ('। প্রথম') ব্যবহার করে পাঠ্য প্রতিস্থাপন করতে পারেন text পাঠ্য ('হাই আমি প্রতিস্থাপন করছি');
কার্তিক চৌহান

উত্তর:


134

পাঠ্যটি নিজস্ব হওয়া উচিত নয়। এটি একটি spanউপাদান মধ্যে রাখুন ।

এটিতে এটি পরিবর্তন করুন:

<div id="one">
       <div class="first"></div>
       <span>"Hi I am text"</span>
       <div class="second"></div>
       <div class="third"></div>
</div>
$('#one span').text('Hi I am replace');

51
এটি ওপি-র প্রশ্নের উত্তর দেয় না, কে না বলেছে যে এইচটিএমএল-র উপর তাদের নিয়ন্ত্রণ রয়েছে।
টার

1
এটি কাজ করা হয়েছে তবে মৃত্যুদন্ড কার্যকর করা বা কীভাবে নিশ্চিত করা যায়? ফাঁকা বা ট্যাগ পরিবর্তন হলে আমি কি ব্যতিক্রম চালাতে পারি? ব্যর্থ বাঁধাইয়ের কারণে কারণ এই ডিভটি কোড দ্বারা তৈরি করা হয়েছে RE আরএসটি বা ডাটাবেস থেকে
সাবার তাবতাবই ইয়াজদি

122

পাঠ্য নোডগুলি ( nodeType==3) সন্ধান করুন এবং প্রতিস্থাপন করুন textContent:

$('#one').contents().filter(function() {
    return this.nodeType == 3
}).each(function(){
    this.textContent = this.textContent.replace('Hi I am text','Hi I am replace');
});

সরাসরি উদাহরণ: http://jsfiddle.net/VgFwS/


6
সত্যিই দুর্দান্ত উত্তর!
wcolbert

6
এটি গ্রহণযোগ্য উত্তর হওয়া উচিত কারণ এটি আপনাকে এইচটিএমএল পরিবর্তন করার প্রয়োজন হয় না!
ওয়াউটার রাটজার্স

2
@ জমিয়েক এফডব্লিউআইডাব্লু আমি এই উত্তরটি পছন্দ করি কারণ এটি মার্কআপ / স্ক্রিপ্টগুলি উদ্বিগ্ন হওয়ার বিষয়ে চিন্তা না করে প্রতিস্থাপনের অনুমতি দেয়

3
এটি আমার জন্য পুরোপুরি কাজ করেন। কখনও কখনও আমরা এমন পরিস্থিতিতে কাজ করি যা এইচটিএমএল (যেমন শেয়ারপয়েন্ট) পরিবর্তন করতে দেয় না। ধন্যবাদ
মার্ক পি।

14

আপনাকে পাঠ্যটি খালি স্ট্রিং ব্যতীত অন্য কোনওটিতে সেট করতে হবে। এছাড়াও, ডিভের এইচটিএমএল কাঠামো সংরক্ষণ করার সময় .html () ফাংশনটি করা উচিত।

$('#one').html($('#one').html().replace('text','replace'));

যদিও এই ক্ষেত্রে এটি কাজ করবে, আমি এই বিকল্পটি পছন্দ করি না কারণ আপনি যদি "প্রথম" শব্দটি "দ্বিতীয়" বা "আমি" দিয়ে "প্রতিস্থাপন" করেন তবে এটি আপনার ট্যাগগুলিকে
JSON

10

আপনি যদি পাঠ্যটি বাস্তবে জানেন তবে আপনি প্রতিস্থাপন করতে যাচ্ছেন আপনি ব্যবহার করতে পারেন

$('#one').contents(':contains("Hi I am text")')[0].nodeValue = '"Hi I am replace"';

http://jsfiddle.net/5rWwh/

অথবা

$('#one').contents(':not(*)')[1].nodeValue = '"Hi I am replace"';

$('#one').contents(':not(*)') এই ক্ষেত্রে পাঠ্য নোডগুলিতে অ-উপাদান চাইল্ড নোডগুলি নির্বাচন করে এবং দ্বিতীয় নোডটি আমরা প্রতিস্থাপন করতে চাই।

http://jsfiddle.net/5rWwh/1/


2
থেকে jQuery 1.8.3 $('#one').contents(':not(*)')কিছুই নির্বাচন করবে।
ব্রুসহিল

0

আর একটি পদ্ধতি হ'ল সেই উপাদানটি রাখা, পাঠ্য পরিবর্তন করুন এবং তারপরে সেই উপাদানটি যুক্ত করুন

const star_icon = $(li).find('.stars svg')
$(li).find('.stars').text(repo.stargazers_count).append(star_icon)

0

কেবলমাত্র যদি আপনি এইচটিএমএল পরিবর্তন করতে না পারেন তবে। খুব আদিম তবে সংক্ষিপ্ত ও কাজ। (এটি পিতামাতার ডিভ খালি করবে তাই শিশু ডিভগুলি সরানো হবে)

$('#one').text('Hi I am replace');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="one">
  <div class="first"></div>
  "Hi I am text"
  <div class="second"></div>
  <div class="third"></div>
</div>


1
এটি # একের সমস্ত শিশু ডিভগুলি সরিয়ে দেয়
স্কট

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