คำถามติดแท็ก dom

สมมติว่าฉันมี<div>องค์ประกอบสามอย่างในหนึ่งหน้า ฉันจะสลับตำแหน่งของครั้งแรกและครั้งที่สามได้อย่างไร<div>อย่างไร? jQuery ใช้ได้

99 javascript  jquery  dom 

Javascript: ฉันมีการแสดง DOM ของโหนด (องค์ประกอบหรือเอกสาร) และฉันกำลังมองหาการแสดงสตริงของมัน เช่น, var el = document.createElement("p"); el.appendChild(document.createTextNode("Test")); ควรให้ผล: get_string(el) == "<p>Test</p>"; ฉันมีความรู้สึกที่ดีว่าฉันพลาดอะไรง่ายๆไปเล็กน้อย แต่ฉันไม่พบวิธีที่ใช้ได้กับ IE, FF, Safari และ Opera ดังนั้น outerHTML จึงไม่มีตัวเลือก

99 javascript  string  dom  cross-browser  element 

คุณใช้ฟังก์ชันอะไรเพื่อรับ innerHTML ของ DOMNode ที่กำหนดในการใช้งาน PHP DOM ใครสามารถให้วิธีแก้ปัญหาที่เชื่อถือได้? แน่นอน outerHTML ก็จะทำเช่นกัน

98 php  dom  innerhtml 

เคอร์เซอร์จะโฟกัสไปที่ช่องป้อนข้อมูลเฉพาะในการโหลดหน้าได้อย่างไร? เป็นไปได้หรือไม่ที่จะรักษาค่าข้อความเริ่มต้นและวางเคอร์เซอร์ไว้ที่ส่วนท้ายของอินพุต? <input type="text" size="25" id="myinputbox" class="input-text" name="input2" value = "initial text" />

98 javascript  html  dom  xhtml 

ฉันมีวิธีการที่จุดประสงค์หลักคือการตั้งค่าคุณสมบัติบนวัตถุ DOM function (el) { el.expando = {}; } ฉันใช้รูปแบบรหัสของ AirBnB ซึ่งทำให้ ESLint เกิดno-param-reassignข้อผิดพลาด: ข้อผิดพลาดการกำหนดให้กับฟังก์ชันพารามิเตอร์ 'el' no-param-reassign ฉันจะจัดการกับวัตถุ DOM ที่ส่งผ่านเป็นอาร์กิวเมนต์ในขณะที่สอดคล้องกับรูปแบบรหัสของ AirBnB ได้อย่างไร มีคนแนะนำให้ใช้การ/* eslint react/prop-types: 0 */อ้างถึงปัญหาอื่นแต่ถ้าฉันจำไม่ผิดสิ่งนี้ใช้ได้ดีสำหรับการตอบสนอง แต่ไม่ใช่สำหรับการจัดการ DOM ดั้งเดิม นอกจากนี้ฉันไม่คิดว่าการเปลี่ยนรูปแบบรหัสเป็นคำตอบ ฉันเชื่อว่าประโยชน์อย่างหนึ่งของการใช้รูปแบบมาตรฐานคือการมีรหัสที่สอดคล้องกันในทุกโปรเจ็กต์และการเปลี่ยนกฎที่จะทำให้รู้สึกเหมือนใช้รูปแบบรหัสหลักอย่าง AirBnB ในทางที่ผิด สำหรับบันทึกที่ผมถาม Airbnb บน GitHub สิ่งที่พวกเขาคิดว่าเป็นวิธีที่จะไปในกรณีเหล่านี้ในรุ่นที่ 766

98 javascript  dom  eslint 

ฉันกำลังอ่านเกี่ยวกับส่วนของเอกสารและการจัดเรียง DOM และสงสัยว่าdocument.createDocumentFragmentแตกต่างจากdocument.createElementที่ดูเหมือนว่าไม่มีอยู่ใน DOM จนกว่าฉันจะผนวกเข้ากับองค์ประกอบ DOM ฉันทำการทดสอบ (ด้านล่าง) และทั้งหมดใช้เวลาเท่ากันทุกประการ (ประมาณ 95ms) เดาได้ว่าอาจเป็นเพราะไม่มีสไตล์ที่ใช้กับองค์ประกอบใด ๆ ดังนั้นจึงอาจไม่มีการแสดงซ้ำ อย่างไรก็ตามตามตัวอย่างด้านล่างเหตุใดฉันจึงควรใช้createDocumentFragmentแทนcreateElementเมื่อแทรกลงใน DOM และความแตกต่างระหว่างสองสิ่งนี้คืออะไร var htmz = "<ul>"; for (var i = 0; i < 2001; i++) { htmz += '<li><a href="#">link ' + i + '</a></li>'; } htmz += '<ul>'; //createDocumentFragment console.time('first'); var div = document.createElement("div"); …

97 javascript  dom 

Наэтотвопросестьответына กองมากเกินнарусском : Какзаблокироватьпользовательскуюфункциюдлясобытиякопированияв JS? คำถาม: มีวิธีใดในการลบเหตุการณ์ทั้งหมดของวัตถุเช่น div หรือไม่? แก้ไข: ฉันกำลังเพิ่มต่อdiv.addEventListener('click',eventReturner(),false);เหตุการณ์ function eventReturner() { return function() { dosomething(); }; } แก้ไข 2: ฉันพบวิธีที่ใช้งานได้ แต่ไม่สามารถใช้กับกรณีของฉันได้: var returnedFunction; function addit() { var div = document.getElementById('div'); returnedFunction = eventReturner(); div.addEventListener('click',returnedFunction,false); //You HAVE to take here a var and not the direct call to …

97 javascript  events  dom 

ลองนึกภาพว่าฉันมี HTML ต่อไปนี้: <div><span><b>This is in bold</b></span></div> ฉันต้องการรับ HTML สำหรับ div รวมถึง div ด้วย Element.innerHTML ส่งคืนเฉพาะ: <span>...</span> ความคิดใด ๆ ? ขอบคุณ

97 javascript  html  dom 

เป็นไปได้หรือไม่ที่จะตรวจจับเมื่อรูปภาพทั้งหมดถูกโหลดผ่านเหตุการณ์ jQuery ตามหลักการแล้วควรมีไฟล์ $(document).idle(function() { } หรือ $(document).contentLoaded(function() { } แต่ฉันไม่พบสิ่งนั้น ฉันคิดว่าจะแนบเหตุการณ์เช่นนี้: $(document).ready(function() { var imageTotal = $('img').length; var imageCount = 0; $('img').load(function(){if(++imageCount == imageTotal) doStuff();}); } แต่จะพังหรือไม่หากโหลดรูปภาพไม่สำเร็จ การเรียกวิธีการนี้มีความสำคัญอย่างยิ่งและในเวลาที่เหมาะสม

96 jquery  dom 

ฉันต้องการเชื่อมโยงวัตถุ JavaScript กับองค์ประกอบ HTML มีวิธีง่ายๆในการทำเช่นนี้หรือไม่? ฉันสังเกตว่าHTML DOMกำหนดเมธอด setAttribute และดูเหมือนว่าสิ่งนี้ถูกกำหนดสำหรับชื่อแอตทริบิวต์โดยพลการ อย่างไรก็ตามสามารถตั้งค่าสตริงเท่านั้น (แน่นอนคุณสามารถใช้สิ่งนี้เพื่อจัดเก็บคีย์ลงในพจนานุกรม) ข้อมูลเฉพาะ (แม้ว่าฉันจะสนใจคำถามทั่วไปเป็นส่วนใหญ่): โดยเฉพาะอย่างยิ่งฉันมีองค์ประกอบ HTML ที่แสดงโหนดในต้นไม้และฉันกำลังพยายามเปิดใช้งานการลากแล้วปล่อย แต่เหตุการณ์การปล่อย jQuery จะให้องค์ประกอบที่ถูกลากและวางเท่านั้น รูปแบบปกติสำหรับการรับข้อมูลไปยังตัวจัดการเหตุการณ์ดูเหมือนว่าจะสร้างองค์ประกอบ HTML ในเวลาเดียวกับที่คุณกำลังสร้างวัตถุ JavaScript จากนั้นกำหนดตัวจัดการเหตุการณ์โดยการปิดทับวัตถุ JavaScript เหล่านี้ - อย่างไรก็ตามสิ่งนี้ไม่ได้ผลเช่นกัน กรณี (ฉันสามารถมีวัตถุส่วนกลางที่ได้รับการเติมข้อมูลเมื่อการลากเริ่มต้นขึ้น ... แต่รู้สึกน่ารังเกียจเล็กน้อย)

96 javascript  dom 

ฉันคิดว่านี่อาจเป็นวิธีที่รวดเร็วในการลบเนื้อหาของตารางขนาดใหญ่มาก (3000 แถว): $jq("tbody", myTable).remove(); แต่ใช้เวลาประมาณห้าวินาทีในการดำเนินการใน firefox ฉันทำอะไรโง่ ๆ (นอกเหนือจากการพยายามโหลด 3000 แถวในเบราว์เซอร์)? มีวิธีที่เร็วกว่านี้ไหม

96 javascript  jquery  dom 

ขออภัยหากคำถามนี้ได้รับคำตอบแล้ว ฉันได้ลองค้นหาวิธีแก้ไขแล้ว แต่ไม่พบสิ่งที่เหมาะกับรหัสของฉัน ฉันยังใหม่กับ jQuery ฉันมีเมนูติดหนึบสองประเภทที่แตกต่างกันสำหรับสองหน้าที่ต่างกัน นี่คือรหัสสำหรับทั้งคู่ $(document).ready(function () { var contentNav = $('.content-nav').offset().top; var stickyNav = function () { var scrollTop = $(window).scrollTop(); if (scrollTop > contentNav) { $('.content-nav').addClass('content-nav-sticky'); } else {; $('.content-nav').removeClass('content-nav-sticky') } }; stickyNav(); $(window).scroll(function () { stickyNav(); }); }); $(document).ready(function () { var stickyNavTop = $('.nav-map').offset().top; …

96 javascript  jquery  html  css  dom 

ดู HTML ง่ายๆนี้: <div id="wrap1"> <iframe id="iframe1"></iframe> </div> <div id="warp2"> <iframe id="iframe2"></iframe> </div> สมมติว่าฉันต้องการย้ายการห่อเพื่อให้#wrap2อยู่ก่อนหน้า#wrap1. iframe ถูกทำให้เสียโดย JavaScript ฉันตระหนักถึง jQuery .insertAfter()และ.insertBefore(). อย่างไรก็ตามเมื่อฉันใช้สิ่งเหล่านี้ iFrame จะสูญเสียตัวแปร HTML และ JavaScript และเหตุการณ์ทั้งหมด ให้บอกว่าต่อไปนี้เป็น HTML ของ iFrame: <html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> // The variable below would change on click // This represents changes …

95 javascript  jquery  dom  iframe 

ฉันสับสนระหว่าง HTMLCollections วัตถุและอาร์เรย์เสมอเมื่อพูดถึง DOM เช่น ... อะไรคือความแตกต่างระหว่างdocument.getElementsByTagName("td")และ$("td")? $("#myTable")และ$("td")เป็นวัตถุ (วัตถุ jQuery) เหตุใด console.log จึงแสดงอาร์เรย์ขององค์ประกอบ DOM ที่อยู่ข้างๆและไม่ใช่วัตถุไม่ใช่อาร์เรย์ "NodeLists" ที่เข้าใจยากคืออะไรและฉันจะเลือกได้อย่างไร โปรดระบุความหมายของสคริปต์ด้านล่างด้วย ขอบคุณ [123,"abc",321,"cba"]=[123,"abc",321,"cba"] {123:123,abc:"abc",321:321,cba:"cba"}=Object { 123=123, abc="abc", 321=321, more...} Node= Node { ELEMENT_NODE=1, ATTRIBUTE_NODE=2, TEXT_NODE=3, more...} document.links= HTMLCollection[a #, a #] document.getElementById("myTable")= <table id="myTable"> document.getElementsByClassName("myRow")= HTMLCollection[tr.myRow, tr.myRow] document.getElementsByTagName("td")= HTMLCollection[td, td, td, td] $("#myTable")= …

94 javascript  jquery  dom 

นิพจน์เหมือนElement.getAttribute("id")และElement.idส่งคืนสิ่งเดียวกัน ควรใช้อันไหนเมื่อเราต้องการคุณสมบัติของวัตถุ HTMLElement มีผู้ใดปัญหาเบราว์เซอร์ข้ามด้วยวิธีการเหล่านี้เช่นgetAttribute()และsetAttribute()? หรือผลกระทบใด ๆ ต่อประสิทธิภาพระหว่างการเข้าถึงคุณสมบัติของวัตถุโดยตรงกับการใช้วิธีแอตทริบิวต์เหล่านี้?

93 javascript  html  dom