Export Chaoxing Learning Quiz to Beautiful PDF

One-sentence goal

On the Chaoxing Learning quiz page: first hide all distracting elements, then directly "Print -> Save as PDF" of the clean version.

The following gives a step-by-step solution + a script that can be directly copied. The entire process only uses the browser console, no plugins required, and can be undone at any time (refresh the page to restore the original state).

1. Open the quiz page

Create a quiz and submit → Enter the quiz details page, ensuring all questions and answers are visible.

2. Copy the "cleanup script" into the console

1. Press F12 (or Ctrl + Shift + I) to open DevTools, switch to Console.
2. Copy the entire script below into it.
3. Optional: First use highlight mode by changing the last line clean(false) to clean(true) and press Enter — all nodes that will be deleted will be marked with a red outline.
4. Optional: After visually confirming there are no mistakes, enter clean(false) in the console and press Enter to perform the actual deletion.

/*********** Chaoxing Quiz - Cleanup Script ***********/
const XPATH = `
(//*[starts-with(@id,'question')]/div/div/div[2]/div[1]/span[position()=1]|
  //*[starts-with(@id,'question')]/div/div/div[1]/a[position()=1]|
  //*[starts-with(@id,'question')]/div/div/div[2]/div[4]|
  //*[starts-with(@id,'qbstuAnswer')]/dt[position()=1]|
  //*[starts-with(@id,'qbstuAnswer')]//dl[1]/dt[position()=1]|
  //*[@id='rightHeight']|
  /html/body/div[1])
`.replace(/\s+/g, '');

function clean(highlight = false) {
  const snap = document.evaluate(
    XPATH, document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null
  );
  for (let i = snap.snapshotLength - 1; i >= 0; i--) {
    const n = snap.snapshotItem(i);
    if (!n) continue;
    highlight ? n.style.outline = '2px solid red' : n.remove();
  }
  console.log(`🎯 ${snap.snapshotLength} nodes ` + (highlight ? 'highlighted' : 'deleted'));
}

clean(false);   // ← true to preview, false to delete
/****************************************************************/

Deleted content

• Favorite button <a>
• Right/wrong indicator div[4]
• My answer <dt> span[1]
• Entire right sidebar #rightHeight
• Top banner /html/body/div[1]

3. Inject "print-only" CSS (optional, for more elegant layout)

If you want the PDF to look more like a formal exam paper, you can also inject a print-only style:

void function () {
  const style = document.createElement('style');
  style.textContent = `
@media print {
  body { font-size: 14px !important; line-height: 1.6; }
  /* Ensure a single question is not broken across two pages */
  [id^="question"], [id^="qbstuAnswer"] { page-break-inside: avoid; }
  /* Extra fallback: hide all buttons, input fields */
  button, input, select, a[href*="javascript"] { display: none !important; }
}
`;
  document.head.appendChild(style);
  console.log('✅ Print style injected');
}();

4. Export directly as PDF

1. Ctrl + P (Mac: ⌘ + P).
2. Target printer: select "Save as PDF / Save as PDF".
3. Layout: Portrait; Margins: Default or Minimal; uncheck headers and footers.
4. Preview is correct → Save, and you get a clean quiz PDF.

Summary

1. One-click cleanup script — Page becomes clean in seconds
2. Optional Print CSS — Print layout more professional
3. Browser save as PDF — Zero plugins, zero dependencies

A clean, well-formatted quiz PDF is ready in no time! Happy studying 📚✨