এইচটিএমএল স্ট্রিং এর পরিবর্তে ডোমে এইচটিএমএল উপাদান যুক্ত করুন

আমি কিভাবে একটি খাঁজ স্ট্রিং পরিবর্তে একটি উপাদান যোগ করতে পারেন?

আমি append ব্যবহার করার চেষ্টা করছি() কিন্তু যে আমার এইচটিএমএল ব্যাখ্যা করে না।

হয়তো এরকম আরো AngularJS উপায় আছে আমি সচেতন নই।

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"> <div class="snippet-code">

document.getElementsByClassName("left-menu")[0].append(
  '<div class="adverts-container top30">' +
    '<div class="advert-carousel">' +
      'Message' +
    '</div>' +
  '</div>'
);
        

</div> </div>

0

5 উত্তর

ParentNode.append() method inserts a set of Node objects or DOMString not the htmlString.

আমি কৌণিক ভাবে জানি না তবে আপনি ব্যবহার করতে পারেন বিশুদ্ধ জাভাস্ক্রিপ্টে HTMLString সন্নিবেশ করতে ADjacentHTML() প্রবেশ করান।

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"> <div class="snippet-code">

document.getElementsByClassName("left-menu")[0].insertAdjacentHTML( 'beforeend',
  '<div class="adverts-container top30">' +
    '<div class="advert-carousel">' +
      'Message' +
    '</div>' +
  '</div>'
);
        

</div> </div>

4
যোগ

আপনি অন্য উপাদানতে এইচটিএমএল স্ট্রিং যোগ করতে এবং বাম মেনু উপাদান এ যোগ করা উচিত:

var tmp=document.createElement('div');
tmp.innerHTML='<div class="adverts-container top30">' +'<div class="advert-carousel">' +'Message' +'</div>' +'</div>';
document.getElementsByClassName("left-menu")[0].appendChild(tmp.firstChild);
3
যোগ

অবশ্যই আছে। সাধারণত, আপনি AngularJS এ জেQ ব্যবহার করতে চান না, এবং ভ্যানিলা শুধুমাত্র AngularJS দ্বারা সরবরাহিত জিনিসগুলির জন্য নয়। এখানে আপনি দেখতে বাঁধাই করছেন। যে নিশ্চয় AngularJs কিছু প্রস্তাব, এমভি কিছু কাঠামো হচ্ছে।

কারণ? অস্পষ্ট এবং সহজ পদগুলিতে, AngularJS এর ​​নিজস্ব উপায় রয়েছে যা সুনির্দিষ্ট জিনিসগুলিকে ডেটা বাইন্ডিং ইত্যাদি নিশ্চিত করে, যদি আপনি তার নিয়মগুলি মেনে চেনেন না তবে সম্ভবত আপনি যে পরিচ্ছন্ন জিনিসগুলি পান তা সম্ভবত ভাঙ্গতে পারবেন।

এখানে আধুনিক AngularJS মধ্যে কিভাবে এই একটি ডেমো হয়:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-sanitize.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">

    


</div> <script> var app = angular.module("myApp", ['ngSanitize']); app.controller("myCtrl", function($scope) { $scope.myText = "My name is:

John Doe

";
});
</script>

এটা বেশ সহজ। আপনি একটি স্ট্রিং হিসাবে এইচটিএমএল সংজ্ঞায়িত করেন, যেটি আপনার দৃষ্টিভঙ্গিতে অ্যাক্সেসযোগ্য যে কোনও ডেটার মতো স্কোপে আবদ্ধ করুন এবং তারপরে HTML টি ইনজেকশনের জন্য ng-bind-html নির্দেশটি ব্যবহার করুন উপাদান যেখানে আপনি নির্দেশ ব্যবহার করছেন।

নিরপেক্ষ, সহজ, নিরাপদ এবং ফলাফল স্ট্যাটিকলিখিত অন্য কোনও টেমপ্লেট হিসাবে কাজ করবে, আপনি কোনও অতিরিক্ত ঝামেলা ছাড়াই ডেটা ব্যান্ড এবং ব্যান্ড করতে পারেন, ডাইজেস্ট চক্রটি স্বাভাবিকভাবেও কাজ করবে।

0
যোগ
তারপরে আপনি অনুক্রমের উচ্চতর কৌণিক নিয়ন্ত্রণটি মোড়ানো করুন, এতে প্রশ্নটির অংশটি অন্তর্ভুক্ত রয়েছে অথবা এটি AngularJS প্রশ্নটি সম্পূর্ণ নয় এবং ট্যাগটি প্রয়োজন নেই। আপনার চয়ন করার একটি নির্বাচক এবং এটিতে এইচটিএমএল ইনজেকশনের জন্য append() পদ্ধতি ব্যবহার করে DOM এর পিতা-মাতা নোডকে লক্ষ্য করে নিয়মিত ভ্যানিলা ডোম ডোমোজেশনটি করুন।
যোগ লেখক DanteTheSmith, উৎস
আমি সম্পূর্ণ যে বুঝতে। আমার সমস্যাটি 'বাম-মেনু' কন্ট্রোলার বা টেম্পলেটের মধ্যে নেই আমি এই অ্যাসাইনমেন্টটি লিখি। এটা সম্পূর্ণরূপে উচ্চপদচিহ্ন আপ উচ্চতর, তাই আমি পরিবর্তে এই কাজকর্ম চেষ্টা করছি।
যোগ লেখক LazioTibijczyk, উৎস
আমি গ্র্যান্ড-গ্র্যান্ড-পিতা-মাতা এর ভেরিয়েবলগুলিকে কীভাবে উল্লেখ করব তা নিশ্চিত না এবং এই পদ্ধতির ব্যবহার করার জন্য সেট করি।
যোগ লেখক LazioTibijczyk, উৎস

আমি এই বিষয়ে কোন বিশেষজ্ঞ নই, কিন্তু আমি বিশ্বাস করি না যে এইচটিএমএল কোড পার্স করা হবে। যদি উপাদানটি তৈরি করতে প্রথমে document.createElement ব্যবহার করেন, তবে আপনি সেই তৈরি উপাদানটিকে DOM এ যোগ করার জন্য অ্যাডেন্ড ব্যবহার করতে পারেন।

0
যোগ

এটা চেষ্টা কর:

var el = document.createElement("div");
el.className = "adverts-container top30";
el.innerHTML = '<div class="advert-carousel">' +
                    'Message' +
                '</div>';
document.querySelectorAll(".left-menu")[0].append(el);
0
যোগ