การเขียนโปรแกรม dom

5

พิจารณาฟังก์ชันนี้: function validate() { var acc = document.getElementsByName('acc').value; var pass = document.getElementsByName('pass').value; alert (acc); } และส่วน HTML นี้: <table border="0" cellpadding="2" cellspacing="0" valign="top"> <tr> <td class="td1">Account</td> <td class="td2"><input type="text" name="acc" /></td> </tr> <tr class="td1"> <td>Password</td> <td class="td2"><input type="password" name="pass" /></td> </tr> </table> <div><button onClick="validate()" class="cupid-greenx">Login now</button></div> กล่องการแจ้งเตือนกำลังแสดง แต่จะแสดง "ไม่ได้กำหนด"

127 javascript html dom

6

อะไรคือความแตกต่างระหว่าง width, innerWidth และ outerWidth, height, innerHeight และ outerHeight ใน jQuery

ฉันเขียนตัวอย่างเพื่อดูว่าอะไรคือความแตกต่าง แต่แสดงผลลัพธ์เดียวกันสำหรับฉันสำหรับความกว้างและความสูง <html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ var div = $('.test'); var width = div.width(); // 200 px var innerWidth = div.innerWidth(); // 200px var outerWidth = div.outerWidth(); // 200px var height = div.height(); // 150 px var innerHeight = div.innerHeight(); // 150 px var outerHeight = …

125 javascript jquery css dom styles

11

รับดัชนีโหนดลูก

ในจาวาสคริปต์แบบตรง (กล่าวคือไม่มีส่วนขยายเช่น jQuery เป็นต้น) มีวิธีกำหนดดัชนีของโหนดลูกภายในโหนดแม่โดยไม่ต้องวนซ้ำและเปรียบเทียบโหนดลูกทั้งหมดหรือไม่ เช่น, var child = document.getElementById('my_element'); var parent = child.parentNode; var childNodes = parent.childNodes; var count = childNodes.length; var child_index; for (var i = 0; i < count; ++i) { if (child === childNodes[i]) { child_index = i; break; } } มีวิธีที่ดีกว่าในการกำหนดดัชนีของเด็กหรือไม่?

125 javascript dom

9

รับข้อความตัวเลือกที่เลือกด้วย JavaScript

ฉันมีรายการแบบเลื่อนลงดังนี้: <select id="box1"> <option value="98">dog</option> <option value="7122">cat</option> <option value="142">bird</option> </select> ฉันจะรับข้อความตัวเลือกจริงแทนค่าโดยใช้ JavaScript ได้อย่างไร ฉันจะได้รับคุณค่าด้วยสิ่งต่างๆเช่น: <select id="box1" onChange="myNewFunction(this.selectedIndex);" > แต่7122ฉันต้องการcatมากกว่า

125 javascript html dom drop-down-menu

15

คุณตั้งชื่อเอกสารใน React ได้อย่างไร?

ฉันต้องการตั้งชื่อเอกสาร (ในแถบชื่อเรื่องของเบราว์เซอร์) สำหรับแอปพลิเคชัน React ของฉัน ฉันได้ลองใช้react-document-title (ดูเหมือนล้าสมัย) และการตั้งค่าdocument.titleในconstructorและcomponentDidMount()- ไม่มีวิธีแก้ปัญหาเหล่านี้

125 javascript reactjs dom

6

innerText กับ innerHTML เทียบกับ label vs text vs textContent vs outerText

ฉันมีรายการแบบเลื่อนลงซึ่งสร้างโดย Javascript ในขณะที่กำลังตัดสินใจว่าอะไรควรเป็นค่าเริ่มต้นที่จะแสดงบนโหลดฉันตระหนักว่าคุณสมบัติต่อไปนี้แสดงค่าเดียวกันทุกประการ: innerText innerHtml label text textContent outerText งานวิจัยของฉันเองแสดงให้เห็นถึงการทดสอบการทำเครื่องหมายหรือการเปรียบเทียบระหว่างสองสามข้อ แต่ไม่ใช่ทั้งหมด ฉันสามารถใช้สามัญสำนึกของตัวเองและเลือก 1 หรืออย่างอื่นเนื่องจากให้ผลลัพธ์เหมือนกัน แต่ฉันกังวลว่านี่จะไม่ใช่ความคิดที่ดีหากข้อมูลมีการเปลี่ยนแปลง สิ่งที่ฉันค้นพบคือ: innerText จะแสดงค่าตามที่เป็นอยู่และละเว้นการจัดรูปแบบ HTML ที่อาจรวมอยู่ด้วย innerHTML จะแสดงค่าและใช้การจัดรูปแบบ HTML ใด ๆ labelดูเหมือนจะเหมือนกับinnerTextดังนั้นฉันจึงไม่เห็นความแตกต่าง textดูเหมือนจะเหมือนกับinnerTextแต่เวอร์ชันชวเลข jQuery textContentดูเหมือนinnerTextแต่จะจัดรูปแบบไว้ (เช่น\n) outerText ดูเหมือนจะเหมือนกับ innerText งานวิจัยของฉันสามารถพาฉันไปได้ไกลที่สุดเท่าที่ฉันจะทำได้เพียงทดสอบสิ่งที่ฉันคิดหรืออ่านสิ่งที่เผยแพร่เท่านั้นมีใครยืนยันได้หรือไม่ว่างานวิจัยของฉันถูกต้องหรือไม่และมีอะไรพิเศษเกี่ยวกับlabelและouterTextหรือไม่

124 javascript html dom

5

รับองค์ประกอบ DOM ตามชื่อคลาส

ฉันใช้PHP DOMและฉันกำลังพยายามรับองค์ประกอบภายในโหนด DOM ที่มีชื่อคลาสที่กำหนด วิธีที่ดีที่สุดในการรับองค์ประกอบย่อยนั้นคืออะไร อัปเดต:ฉันลงเอยด้วยการใช้MechanizePHP ซึ่งทำงานได้ง่ายกว่ามาก

124 php css dom

8

รับองค์ประกอบตามแอตทริบิวต์เมื่อ querySelectorAll ไม่พร้อมใช้งานโดยไม่ใช้ไลบรารี?

<p data-foo="bar"> คุณจะเทียบเท่ากับ document.querySelectorAll('[data-foo]') ที่querySelectorAllคือไม่สามารถใช้งาน ? ฉันต้องการโซลูชันดั้งเดิมที่ใช้งานได้อย่างน้อยใน IE7 ฉันไม่สนใจ IE6

123 javascript dom

2

Javascript querySelector เทียบกับ getElementById [closed]

ปิด . คำถามนี้เป็นคำถามความคิดเห็นตาม ขณะนี้ยังไม่ยอมรับคำตอบ ต้องการปรับปรุงคำถามนี้หรือไม่ อัปเดตคำถามเพื่อให้สามารถตอบได้ด้วยข้อเท็จจริงและการอ้างอิงโดยแก้ไขโพสต์นี้ ปิดให้บริการใน5 ปีที่ผ่านมา ปรับปรุงคำถามนี้ ฉันได้ยินมาว่าquerySelector& querySelectorAllเป็นวิธีการใหม่ในการเลือกDOMองค์ประกอบ พวกเขาเปรียบเทียบกับวิธีการรุ่นเก่าอย่างไรgetElementById& getElementsByClassNameในแง่ของประสิทธิภาพและการรองรับเบราว์เซอร์? ประสิทธิภาพเปรียบเทียบกับการใช้ตัวเลือกคิวรีของ jQuery อย่างไร มีคำแนะนำแนวทางปฏิบัติที่ดีที่สุดสำหรับชุดเนทีฟที่จะใช้หรือไม่?

122 javascript jquery dom

10

การต่อท้ายสตริง HTML เข้ากับ DOM

วิธีต่อท้ายสตริง HTML นี้ var str = '<p>Just some <span>text</span> here</p>'; ไปยัง DIV ด้วย ID 'test'ซึ่งอยู่ใน DOM? (Btw div.innerHTML += str;ไม่เป็นที่ยอมรับ)

121 javascript html dom browser

7

React.js: onChange เหตุการณ์สำหรับ contentEditable

ฉันจะฟังเหตุการณ์การเปลี่ยนแปลงสำหรับcontentEditable- ตามการควบคุมได้อย่างไร var Number = React.createClass({ render: function() { return <div> <span contentEditable={true} onChange={this.onChange}> {this.state.value} </span> = {this.state.value} </div>; }, onChange: function(v) { // Doesn't fire :( console.log('changed', v); }, getInitialState: function() { return {value: '123'} } }); React.renderComponent(<Number />, document.body); http://jsfiddle.net/NV/kb3gN/1621/

120 javascript dom contenteditable reactjs

3

ตั้งค่าแอตทริบิวต์ที่กำหนดเองโดยใช้ JavaScript

ฉันใช้ The DynaTree (https://code.google.com/p/dynatree) แต่ฉันมีปัญหาและหวังว่าจะมีใครช่วยได้ .. ฉันกำลังแสดงต้นไม้ในหน้าดังต่อไปนี้: <div id="tree"> <ul> <li class="folder">Outputs <ul> <li id="item1" data="icon: 'base.gif', url: 'page1.htm', target: 'AccessPage'">Item 1 Title <li id="item2" data="icon: 'base.gif', url: 'page2.htm', target: 'AccessPage'">Item 2 Title <li id="item3" data="icon: 'base.gif', url: 'page3.htm', target: 'AccessPage'">Item 3 Title <li id="item4" data="icon: 'base.gif', url: 'page4.htm', target: …

119 javascript dom dynatree

10

ใช้ querySelectorAll เพื่อดึงข้อมูลลูกโดยตรง

ฉันสามารถทำได้: <div id="myDiv"> <div class="foo"></div> </div> myDiv = getElementById("myDiv"); myDiv.querySelectorAll("#myDiv > .foo"); นั่นคือฉันสามารถดึงข้อมูลลูกโดยตรงทั้งหมดของmyDivองค์ประกอบที่มีคลาสได้.fooสำเร็จ ปัญหาคือมันรบกวนฉันที่ฉันต้องรวม#myDivตัวเลือกไว้ในตัวเลือกเนื่องจากฉันกำลังเรียกใช้การสืบค้นในmyDivองค์ประกอบ (ดังนั้นจึงเห็นได้ชัดว่าซ้ำซ้อน) ฉันควรจะสามารถออกจากระบบได้#myDivแต่ตัวเลือกนั้นไม่ใช่ไวยากรณ์ทางกฎหมายเนื่องจากเริ่มต้นด้วยไฟล์>. ไม่มีใครรู้วิธีเขียนตัวเลือกที่ได้รับเฉพาะลูกโดยตรงขององค์ประกอบที่ตัวเลือกทำงานอยู่

119 javascript dom css-selectors

5

รับองค์ประกอบตามดัชนีใน jQuery

ฉันมีรายการที่ไม่เรียงลำดับและดัชนีของliแท็กในรายการนั้น ฉันต้องได้รับliองค์ประกอบโดยใช้ดัชนีนั้นและเปลี่ยนสีพื้นหลัง เป็นไปได้หรือไม่โดยไม่ต้องวนซ้ำรายการทั้งหมด ฉันหมายความว่ามีวิธีใดบ้างที่สามารถใช้งานฟังก์ชันนี้ได้ นี่คือรหัสของฉันซึ่งฉันเชื่อว่าจะใช้ได้ ... <script type="text/javascript"> var index = 3; </script> <ul> <li>India</li> <li>Indonesia</li> <li>China</li> <li>United States</li> <li>United Kingdom</li> </ul> <script type="text/javascript"> // I want to change bgColor of selected li element $('ul li')[index].css({'background-color':'#343434'}); // Or, I have seen a function in jQuery doc, which gives nothing to …

117 jquery dom get

3

วิธีค้นหาองค์ประกอบ DOM โดยใช้ตัวเลือก XPath หรือ CSS ใน Chrome Developer Tools

เอกสารhttp://code.google.com/chrome/devtools/docs/elements.htmlระบุว่ารองรับ XPath หรือ CSS selectors แต่เมื่อฉันลองแล้วดูเหมือนจะไม่ได้ผลสำหรับฉัน มีใครรู้วิธีใช้ไหม

116 dom google-chrome google-chrome-devtools

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