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

25

ตรวจสอบว่าองค์ประกอบมีคลาสใน JavaScript หรือไม่?

ใช้ JavaScript ธรรมดา (ไม่ใช่ jQuery) มีวิธีการตรวจสอบว่าองค์ประกอบมีคลาสหรือไม่? ขณะนี้ฉันกำลังทำสิ่งนี้: var test = document.getElementById("test"); var testClass = test.className; switch (testClass) { case "class1": test.innerHTML = "I have class1"; break; case "class2": test.innerHTML = "I have class2"; break; case "class3": test.innerHTML = "I have class3"; break; case "class4": test.innerHTML = "I have class4"; break; …

586 javascript html css dom

16

ค้นหาว่ามีการตรวจสอบปุ่มตัวเลือกด้วย JQuery หรือไม่

ฉันสามารถตั้งค่าปุ่มตัวเลือกให้ตรวจสอบได้ดี แต่สิ่งที่ฉันต้องการทำคือตั้งค่า 'ผู้ฟัง' ที่เปิดใช้งานเมื่อมีการตรวจสอบปุ่มตัวเลือก รับตัวอย่างรหัสต่อไปนี้: $("#element").click(function() { $('#radio_button').attr("checked", "checked"); }); มันเพิ่มคุณสมบัติที่เลือกและทุกอย่างดี แต่ฉันจะเพิ่มการแจ้งเตือนได้อย่างไร ตัวอย่างเช่นที่ปรากฏขึ้นเมื่อเลือกปุ่มตัวเลือกโดยไม่ใช้ฟังก์ชั่นคลิก?

584 jquery html jquery-ui checked

13

ผู้ควบคุม AngularJS หนึ่งคนสามารถเรียกอีกคนหนึ่งได้หรือไม่

เป็นไปได้ไหมที่จะมีคอนโทรลเลอร์หนึ่งอันใช้อีกคอนโทรลเลอร์หนึ่ง? ตัวอย่างเช่น: เอกสาร HTML นี้จะพิมพ์ข้อความที่จัดส่งโดยMessageCtrlคอนโทรลเลอร์ในmessageCtrl.jsไฟล์ <html xmlns:ng="http://angularjs.org/"> <head> <meta charset="utf-8" /> <title>Inter Controller Communication</title> </head> <body> <div ng:controller="MessageCtrl"> <p>{{message}}</p> </div>  <script src="http://code.angularjs.org/angular-0.9.19.js" ng:autobind></script> <script src="js/messageCtrl.js" type="text/javascript"></script> </body> </html> ไฟล์คอนโทรลเลอร์มีรหัสต่อไปนี้: function MessageCtrl() { this.message = function() { return "The current date is: " + new Date().toString(); }; …

581 javascript html angularjs

4

วิธีการเปลี่ยนสีของแถบส่วนหัวและแถบที่อยู่ใน Chrome รุ่นใหม่ล่าสุดบน Lollipop

ยังไม่พบอะไรเลยในหัวข้อนี้ ฉันชอบความสามารถในการเปลี่ยนสีของแถบที่อยู่และสีส่วนหัวของภาพรวมหรือไม่ มีวิธีง่าย ๆ ในการทำเช่นนี้? . ฉันคิดว่าคุณต้องใช้ Android 5.0 Lollipop สำหรับการทำงานและของ Chrome ผสานแท็บและปพลิเคชันชุดบน

578 android html google-chrome

12

วิธีเพิ่มไอคอนแท็บเบราว์เซอร์ (favicon) สำหรับเว็บไซต์ได้อย่างไร

ฉันทำงานบนเว็บไซต์และฉันต้องการเพิ่มไอคอนเล็ก ๆ ลงในแท็บเบราว์เซอร์ ฉันจะทำสิ่งนี้ใน HTML และจะต้องวางรหัสไว้ที่ไหน (เช่นส่วนหัว) ฉันมี.pngไฟล์โลโก้ที่ฉันต้องการแปลงเป็นไอคอน ที่เกี่ยวข้อง: ภาพชุด HTML บนแท็บเบราว์เซอร์

578 html icons favicon

7

ฉันควรใช้แท็ก <i> สำหรับไอคอนแทน <span> หรือไม่ [ปิด]

ปิด คำถามนี้เป็นคำถามความคิดเห็นตาม ไม่ยอมรับคำตอบในขณะนี้ ต้องการปรับปรุงคำถามนี้หรือไม่ อัปเดตคำถามเพื่อให้สามารถตอบข้อเท็จจริงและการอ้างอิงได้โดยแก้ไขโพสต์นี้ ปิดให้บริการใน3 ปีที่ผ่านมา ฉันดูที่แหล่งที่มาของ Facebook พวกเขาใช้<i>แท็กเพื่อแสดงไอคอน นอกจากนี้วันนี้ฉันก็ดู Bootstrap ของ Twitter ด้วย นอกจากนี้ยังใช้<i>แท็กเพื่อแสดงไอคอน แต่, จากสเป็ค HTML5 : องค์ประกอบ I แสดงช่วงของข้อความในเสียงหรืออารมณ์ทางเลือกหรืออื่น ๆ จากออฟเซ็ตปกติเช่นการกำหนดทางอนุกรมวิธานศัพท์ทางเทคนิควลีสำนวนจากภาษาอื่นความคิดชื่อเรือหรืออื่น ๆ งานประพันธ์ที่มีการนำเสนอแบบตัวพิมพ์ทั่วไปเป็นตัวเอียง เหตุใดพวกเขาจึงใช้<i>แท็กเพื่อแสดงไอคอน มันไม่ใช่การฝึกฝนที่เลวร้ายใช่ไหม? หรือฉันกำลังพลาดบางสิ่งที่นี่ ฉันใช้spanเพื่อแสดงไอคอนและดูเหมือนว่าจะใช้งานได้สำหรับฉันจนถึงตอนนี้ ปรับปรุง: Bootstrap 3 ตอนนี้ใช้spanสำหรับไอคอน Doc อย่างเป็นทางการ

572 html semantic-markup

23

คุณจะรับเนื้อหาที่เป็นศูนย์กลางโดยใช้ Twitter Bootstrap ได้อย่างไร

ฉันพยายามทำตามตัวอย่างพื้นฐานมาก ใช้หน้าเริ่มต้นและระบบกริดฉันหวังว่าต่อไปนี้: <div class="row"> <div class="span12"> <h1>Bootstrap starter template</h1> <p>Example text.</p> </div> </div> เรียกใช้ข้อมูลโค้ดซ่อนผลลัพธ์ขยายตัวอย่างข้อมูล ... จะสร้างข้อความกึ่งกลาง อย่างไรก็ตามมันยังคงปรากฏบนด้านซ้ายสุด ผมทำอะไรผิดหรือเปล่า?

569 html css twitter-bootstrap

27

เพิ่มเคล็ดลับเครื่องมือให้กับ div

ฉันมีแท็ก div ดังนี้: <div> <label>Name</label> <input type="text"/> </div> ฉันจะแสดงคำแนะนำเครื่องมือ:hoverของ div ได้อย่างไรโดยควรให้เอฟเฟ็กต์เข้า / ออกจางลง

568 javascript html css tooltip

21

ตัดคำในตาราง HTML

ฉันใช้คำword-wrap: break-wordสั่งตัดคำในdivs และspans อย่างไรก็ตามดูเหมือนว่าจะไม่ทำงานในเซลล์ตาราง ฉันมีตารางตั้งค่าwidth:100%โดยมีหนึ่งแถวและสองคอลัมน์ ข้อความในคอลัมน์แม้ว่าจะมีสไตล์ด้านบนword-wrapแต่ก็ไม่ได้ห่อ ทำให้ข้อความผ่านขอบเขตของเซลล์ สิ่งนี้เกิดขึ้นกับ Firefox, Google Chrome และ Internet Explorer นี่คือลักษณะที่มา: td { border: 1px solid; } <table style="width: 100%;"> <tr> <td> <div style="word-wrap: break-word;"> Looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong word </div> </td> <td><span style="display: inline;">Short word</span></td> </tr> </table> เรียกใช้ข้อมูลโค้ดHide resultsขยายตัวอย่างข้อมูล คำที่ยาวด้านบนมีขนาดใหญ่กว่าขอบเขตของหน้าเว็บของฉัน แต่ไม่ได้ตัดกับ HTML ด้านบน ฉันลองทำตามคำแนะนำด้านล่างเพื่อเพิ่มtext-wrap:suppressและtext-wrap:normalแต่ก็ไม่ได้ช่วยอะไร

566 html css html-table

3

การฝังอิมเมจ Base64

หมดความอยากรู้อยากเห็นแล้วภาพ Base64 ของเบราว์เซอร์ใดที่ทำงานได้ดี? สิ่งที่ผมหมายถึงคือนี้ ฉันรู้ว่ามันไม่ได้เป็นวิธีแก้ปัญหาที่ดีสำหรับทุกสิ่งส่วนใหญ่เพราะมันเพิ่มขนาดหน้ากระดาษได้เล็กน้อย - ฉันแค่อยากรู้อยากเห็น ตัวอย่างบางส่วน: HTML: <img alt="Embedded Image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA..." /> CSS: div.image { width:100px; height:100px; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA...); }

564 html base64 browser

10

ที่เก็บข้อมูล HTML5 โลคัลกับที่เก็บข้อมูลเซสชัน

นอกเหนือจากการไม่คงอยู่และถูกกำหนดขอบเขตไปยังหน้าต่างปัจจุบันเท่านั้นยังมีประโยชน์อื่นใดบ้าง (ประสิทธิภาพการเข้าถึงข้อมูลและอื่น ๆ ) ไปยังที่จัดเก็บข้อมูลเซสชันผ่านการจัดเก็บในท้องถิ่นหรือไม่

561 javascript html local-storage session-storage

3

เหตุใดเบราว์เซอร์จึงตรงกับตัวเลือก CSS จากขวาไปซ้าย

CSS Selectors ถูกจับคู่โดยเครื่องมือเบราว์เซอร์จากขวาไปซ้าย ดังนั้นพวกเขาจึงหาเด็ก ๆ ก่อนจากนั้นตรวจสอบผู้ปกครองเพื่อดูว่าตรงกับส่วนที่เหลือของกฎหรือไม่ ทำไมนี้ มันเป็นเพียงเพราะสเป็คบอกว่า? มันจะมีผลต่อเค้าโครงท้ายที่สุดหรือไม่หากประเมินจากซ้ายไปขวา สำหรับฉันวิธีที่ง่ายที่สุดที่จะทำคือใช้ตัวเลือกที่มีจำนวนองค์ประกอบน้อยที่สุด ดังนั้น IDs เป็นอันดับแรก (เนื่องจากควรคืนค่า 1 องค์ประกอบเท่านั้น) จากนั้นอาจคลาสหรือองค์ประกอบที่มีจำนวนโหนดน้อยที่สุด - เช่นอาจมีเพียงหนึ่งช่วงบนหน้าดังนั้นไปที่โหนดนั้นโดยตรงด้วยกฎใด ๆ ที่อ้างอิงช่วง นี่คือลิงค์บางส่วนที่สำรองข้อมูลการอ้างสิทธิ์ของฉัน http://code.google.com/speed/page-speed/docs/rendering.html https://developer.mozilla.org/en/Writing_Efficient_CSS ดูเหมือนว่าจะทำเช่นนี้เพื่อหลีกเลี่ยงการดูเด็กทุกคนของพ่อแม่ (ซึ่งอาจเป็นจำนวนมาก) มากกว่าพ่อแม่ทุกคนของเด็กที่จะต้องเป็นหนึ่ง แม้ว่า DOM จะลึกมันก็จะดูที่หนึ่งโหนดต่อระดับแทนที่จะเป็นหลาย ๆ ในการจับคู่ RTL ง่ายกว่าหรือเร็วกว่าในการประเมิน CSS selectors LTR หรือ RTL

560 html css browser css-selectors

7

ทำให้ div เลื่อนในแนวตั้งโดยใช้ CSS

นี้ <div id="" style="overflow:scroll; height:400px;"> เรียกใช้ข้อมูลโค้ดซ่อนผลลัพธ์ขยายตัวอย่างข้อมูล ช่วยให้divผู้ใช้สามารถเลื่อนทั้งในแนวนอนและแนวตั้ง ฉันจะเปลี่ยนเพื่อให้ div สามารถเลื่อนได้ในแนวตั้งเท่านั้น ?

560 html css

16

jQuery.click () vs onClick

ฉันมีแอพพลิเคชั่นขนาดใหญ่ jQuery และฉันใช้สองวิธีต่อไปนี้สำหรับการคลิกเหตุการณ์ วิธีแรก HTML <div id="myDiv">Some Content</div> jQuery $('#myDiv').click(function(){ //Some code }); วิธีที่สอง HTML <div id="myDiv" onClick="divFunction()">Some Content</div> การเรียกใช้ฟังก์ชัน JavaScript function divFunction(){ //Some code } ฉันใช้วิธีแรกหรือวิธีที่สองในแอปพลิเคชันของฉัน อันไหนดีกว่า? ดีกว่าสำหรับประสิทธิภาพ? และมาตรฐาน?

558 javascript jquery html jquery-events

22

การเลือกข้อความทั้งหมดในการป้อนข้อความ HTML เมื่อคลิก

ฉันมีรหัสต่อไปนี้เพื่อแสดงกล่องข้อความในหน้าเว็บ HTML <input type="text" id="userid" name="userid" value="Please enter the user ID" /> เมื่อหน้าดังกล่าวปรากฏขึ้นข้อความจะมีข้อความกรุณาใส่ข้อความID ผู้ใช้ อย่างไรก็ตามฉันพบว่าผู้ใช้ต้องคลิก 3 ครั้งเพื่อเลือกข้อความทั้งหมด (ในกรณีนี้คือโปรดป้อน ID ผู้ใช้ ) เป็นไปได้หรือไม่ที่จะเลือกข้อความทั้งหมดด้วยการคลิกเพียงครั้งเดียว? แก้ไข: ขออภัยฉันลืมที่จะพูดว่า: ฉันต้องใช้อินพุต type="text"

553 javascript html textinput

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