วิธีเพิ่ม `style = display:“ block” ในองค์ประกอบโดยใช้ jQuery

วิธีการเพิ่มstyle=display:"block"องค์ประกอบใน jQuery?

$("#YourElementID").css("display","block");

แก้ไข:หรือ dave thieben ชี้ให้เห็นในความคิดเห็นของเขาด้านล่างคุณสามารถทำได้เช่นกัน:

$("#YourElementID").css({ display: "block" });

ขึ้นอยู่กับวัตถุประสงค์ของการตั้งค่าคุณสมบัติการแสดงผลคุณอาจต้องการดู

$("#yourElementID").show()

และ

$("#yourElementID").hide()

มีหลายฟังก์ชั่นในการทำงานที่เขียนด้านล่างตามลำดับความสำคัญ

• .css()

ตั้งค่าคุณสมบัติ CSS หนึ่งรายการขึ้นไปสำหรับชุดองค์ประกอบที่ตรงกัน

$("div").css("display", "block")

// Or add multiple CSS properties
$("div").css({
  display: "block",
  color: "red",
  ...
})

• .show()

แสดงองค์ประกอบที่ตรงกันและเทียบเท่ากับการโทรโดยประมาณ.css("display", "block")

คุณสามารถแสดงองค์ประกอบโดยใช้.show()แทน

$("div").show()

• .attr()

ตั้งค่าคุณสมบัติตั้งแต่หนึ่งรายการขึ้นไปสำหรับชุดองค์ประกอบที่ตรงกัน

หากองค์ประกอบเป้าหมายไม่มีstyleแอตทริบิวต์คุณสามารถใช้วิธีนี้เพื่อเพิ่มรูปแบบอินไลน์ไปยังองค์ประกอบ

$("div").attr("style", "display:block")

// Or add multiple CSS properties
$("div").attr("style", "display:block; color:red")

• JavaScript

คุณสามารถเพิ่มคุณสมบัติ CSS เฉพาะให้กับองค์ประกอบโดยใช้จาวาสคริปต์ที่บริสุทธิ์ถ้าคุณไม่ต้องการใช้ jQuery

var div = document.querySelector("div");
// One property
div.style.display = "block";
// Multiple properties
div.style.cssText = "display:block; color:red"; 
// Multiple properties
div.setAttribute("style", "display:block; color:red");

หากคุณต้องการเพิ่มหลายรายการคุณสามารถทำได้ดังนี้:

$('#element').css({
    'margin-left': '5px',
    'margin-bottom': '-4px',
    //... and so on
});

ตามแนวปฏิบัติที่ดีฉันจะใส่ชื่อคุณสมบัติระหว่างอัญประกาศเพื่อให้เส้นประเนื่องจากรูปแบบส่วนใหญ่มีเส้นประในตัว ถ้าเป็น 'display' แสดงว่าอัญประกาศเป็นตัวเลือก แต่ถ้าคุณมีเครื่องหมายขีดคั่นมันจะไม่ทำงานหากไม่มีเครื่องหมายอัญประกาศ อย่างไรก็ตามเพื่อให้ง่าย: ใส่ไว้ในเครื่องหมายคำพูดเสมอ