javascript - jQuery ডকুমেন্ট। সমীক্ষা সমতুল্য সমতুল্য?




6 Answers

কেবলমাত্র একটি jQuery কন্সট্রকটারে যোগ করতে চান এমন উপাদানগুলির HTML সরবরাহ করা $() jQuery এর append() পদ্ধতি ব্যবহার করে DOM এ যোগ করার জন্য উপযুক্ত, নতুন নির্মিত HTML থেকে একটি jQuery অবজেক্ট ফিরিয়ে দেবে।

উদাহরণ স্বরূপ:

var t = $("<table cellspacing='0' class='text'></table>");
$.append(t);

আপনি যদি ইচ্ছা করেন তাহলে আপনি এই টেবিলের প্রোগ্রাম্যাটিকভাবে ভরাট করতে পারেন।

এটি আপনাকে ক্লাসের নামগুলি বা অন্যান্য বৈশিষ্ট্যগুলি সহ আপনার createElement কোনও HTML টি নির্দিষ্ট করার ক্ষমতা দেয়, যা আপনি createElement ব্যবহার করার চেয়ে আরও সংক্ষিপ্ত পেতে createElement এবং তারপরে JS এর ​​মাধ্যমে cellSpacing এবং className মত বৈশিষ্ট্য নির্ধারণ করে।

javascript jquery html dom dhtml

আমি কিছু পুরানো জাভাস্ক্রিপ্ট কোড refactoring করছি এবং DOM ম্যানিপুলেশন অনেক যাচ্ছে।

var d = document;
var odv = d.createElement("div");
odv.style.display = "none";
this.OuterDiv = odv;

var t = d.createElement("table");
t.cellSpacing = 0;
t.className = "text";
odv.appendChild(t);

আমি jQuery ব্যবহার করে এটি করতে একটি ভাল উপায় আছে কিনা জানতে চাই। আমি সঙ্গে পরীক্ষা করা হয়েছে:

var odv = $.create("div");
$.append(odv);
// And many more

কিন্তু আমি নিশ্চিত নই যে এইটা কোনও ভাল।




jQuery1.8 থেকে, উপাদান তৈরি করতে jQuery.parseHTML ব্যবহার করে একটি ভাল পছন্দ।

দুটি সুবিধা আছে:

1. আপনি যদি পুরানো পদ্ধতিটি ব্যবহার করেন তবে এটি $(string) মতো কিছু হতে পারে তবে jQuery টি এইচটিএমএল ট্যাগ নির্বাচন করতে বা একটি নতুন উপাদান তৈরি করতে নিশ্চিত করতে স্ট্রিংটি পরীক্ষা করবে। $.parseHTML() ব্যবহার করে, আপনি jQuery কে বলবেন যে আপনি একটি নতুন উপাদান স্পষ্টভাবে তৈরি করতে চান, তাই কর্মক্ষমতা একটু ভাল হতে পারে।

2. আরো গুরুত্বপূর্ণ বিষয় হল যে আপনি যদি পুরানো পদ্ধতি ব্যবহার করেন তবে ক্রস সাইট আক্রমণ ( আরও তথ্য ) হতে পারে। যদি আপনার মত কিছু আছে:

    var userInput = window.prompt("please enter selector");
    $(userInput).hide();

একটি খারাপ লোক আপনাকে টিজ করতে <script src="xss-attach.js"></script> ইনপুট করতে পারে। ভাগ্যক্রমে, $.parseHTML() জন্য এই বিব্রতকরতা এড়াতে:

var a = $('<div>')
// a is [<div>​</div>​]
var b = $.parseHTML('<div>')
// b is [<div>​</div>​]
$('<script src="xss-attach.js"></script>')
// jQuery returns [<script src=​"xss-attach.js">​</script>​]
$.parseHTML('<script src="xss-attach.js"></script>')
// jQuery returns []

তবে, অনুগ্রহ করে লক্ষ্য করুন যে a একটি jQuery অবজেক্ট, যখন b হল একটি HTML উপাদান:

a.html('123')
// [<div>​123​</div>​]
b.html('123')
// TypeError: Object [object HTMLDivElement] has no method 'html'
$(b).html('123')
// [<div>​123​</div>​]



হালনাগাদ

JQuery এর সর্বশেষ সংস্করণগুলির হিসাবে, নিম্নোক্ত পদ্ধতিটি দ্বিতীয় বস্তুর মধ্যে প্রেরিত বৈশিষ্ট্যগুলিকে বরাদ্দ করে না

পূর্ববর্তী উত্তর

আমি jQuery সাথে একসঙ্গে document.createElement('div') ব্যবহার করে অনুভব করছি:

$(document.createElement('div'), {
    text: 'Div text',
    'class': 'className'
}).appendTo('#parentDiv');



var mydiv = $('<div />') // also works



এটা সব সোজা সোজা এগিয়ে! একটি দম্পতি দ্রুত উদাহরণ heres ...

var $example = $( XMLDocRoot );
var $element = $( $example[0].createElement('tag') );
// Note the [0], which is the root

$element.attr({
id: '1',
hello: 'world'
});
var $example.find('parent > child').append( $element );



বক্সের বাইরে jQueryটির একটি createElement এর সমতুল্য নেই। প্রকৃতপক্ষে jQuery এর কাজটি অভ্যন্তরীণভাবে অভ্যন্তরীণভাবে বিশুদ্ধ DOM ম্যানিপুলেশন ব্যবহার করে অভ্যন্তরীণভাবে করা হয়। অ্যাডাম উপরে উল্লিখিত এইভাবে আপনি অনুরূপ ফলাফল অর্জন করতে পারেন।

প্লাগিনগুলি উপলব্ধ রয়েছে যা অভ্যন্তরীণ HTML এর মত DOM ব্যবহার করে appendDOM , DOMEC এবং FlyDOM মতো কয়েকটি নামকরণ করতে পারে। পারফরম্যান্স অনুযায়ী নেটিভ jquery এখনও সবচেয়ে কার্যকরী (প্রধানত becasue এটি অভ্যন্তরীণ HTML ব্যবহার করে)




Related