Week 6 Exercise 2

Console Log Example

JavaScript Week 5 Exercise 1

Cheese of the UK

Banbury cheese

Once one of Banbury's most prestigious exports, and nationally famous, its production went into decline by the 18th-century, and eventually ceased. The cheese is best known today through an insult in Shakespeare's Merry Wives of Windsor (1597).

Cheddar cheese

The UK's most famous cheese, and one of the most popular. Aging is the only difference between mild and sharp Cheddars. The longer cheese is aged naturally, the sharper and more pronounced the Cheddar flavor becomes. Mild Cheddar cheese is generally aged for 2 to 3 months, whereas an extra sharp might be aged for as long as a year.

Stilton Cheese

Stilton is produced in two varieties: Blue, which has had Penicillium roqueforti added to generate a characteristic smell and taste, and White, which has not. Stilton is only made in three Counties in England: Derbyshire, Nottinghamshire and Leicestershire, and is is a protected cheese. Stilton is protected by a Certification Trade Mark and EU Protected Designation of Origin (PDO).

Stinking Bishop Cheese

Perhaps the UK's most notorious cheese, known for its distinctive odour. The colour of Stinking Bishop ranges from white/yellow to beige, with an orange to grey rind. It is moulded into wheels 2 kilograms (4.4 lb) in weight, 20 centimetres (7.9 in) in diameter, and 4 centimetres (1.6 in) deep. Only about 20 tonnes are produced each year. The distinctive odour comes from the process with which the cheese is washed during its ripening; it is immersed in perry made from the local Stinking Bishop pear (from which the cheese gets its name) every four weeks while it matures. To increase the moisture content and to encourage bacterial activity, salt is not added until the cheese is removed from its mould.

		
001window.onload = function(){
		
002	createList();
		
003	//add event handler
		
004	document.getElementById('darkmode').addEventListener('click',swapCssClass);		
		
005}
		
006function swapCssClass()
		
007{
		
008	// grab list
		
009	const navList = document.getElementById('cheese-list').firstElementChild;
		
010
		
011	// make changes based on the button (that was clicked) text
		
012	if(this.innerHTML=='Dark Mode')
		
013	{
		
014		const elementToSwap = document.getElementById('pagewrapperLight');
		
015		elementToSwap.setAttribute('id','pagewrapperDark');
		
016		this.innerHTML='Light Mode';
		
017		navList.classList.add("dark");
		
018	}
		
019	else
		
020	{
		
021		const elementToSwap = document.getElementById('pagewrapperDark');
		
022		elementToSwap.setAttribute('id','pagewrapperLight');
		
023		this.innerHTML='Dark Mode';
		
024		navList.classList.remove("dark");
		
025	}
		
026}
		
027
		
028function createList()
		
029{
		
030	// start search position for h2 nodes (as there are h2's in the html above!)
		
031	const containerDiv = document.getElementById('pagewrapperLight');
		
032	// We create a collection of all the H2 nodes
		
033	const headingsElements = containerDiv.getElementsByTagName('h2');
		
034
		
035	// Get target section to place list
		
036	const targetElement = document.getElementById('cheese-list');
		
037
		
038	// We create the UL that wil hold the list items
		
039	const ulElement = document.createElement('ul');
		
040
		
041	 //Go through the h2 node collection and 
		
042	// for each node found, we create 
		
043	// 1)  create a new LI element
		
044	// 2)  create a new text Node - using the H2 node inner text
		
045	// 3)  append the  text node to the LI element created
		
046	// 4)  append the LI with text to the UL element created
		
047	
		
048	for(let i = 0; i < headingsElements.length; i++)
		
049	{ 
		
050
		
051/*1*/	const liElement = document.createElement('li');
		
052/*2*/	const liText = document.createTextNode(headingsElements[i].innerText);
		
053/*3*/	liElement.appendChild(liText);
		
054/*4*/	ulElement.appendChild(liElement);
		
055	 }
		
056
		
057	//the new ul with the list is appended to the DOM!
		
058	targetElement.appendChild(ulElement);
		
059}

JavaScript 2022

Term 3 Wednesday