I tried to make a list using script. but the result is not same.
Could you tell me, How can I fix this?
<ul>
<li><a href="Web Development.html">Web Development</a></li>
<li><a href="Automotive Design.html">Automorive Design</a></li>
<li><a href="Editorial Design.html">Editorial Design</a></li>
<li><a href="3D Modeling.html">3D Modeling</a></li>
<li><a href="Fine Art.html">Fine Art</a></li>
<li><a href="Contact.html">Contact</a></li>
<li><a href="Help.html">Help</a></li>
</ul>
<ul>
<script>
var page_list= document.querySelectorAll('a');
var i = 0;
while(i<page_list.length){
document.write('<li>'+page_list[i]+'</li>');
i=i+1;
}
document.write(page_list[1]);
</script>
</ul>
>Solution :
Your program does produce a list of URLs
Click the blue button to see it work.
<ul>
<li><a href="Web Development.html">Web Development</a></li>
<li><a href="Automotive Design.html">Automorive Design</a></li>
<li><a href="Editorial Design.html">Editorial Design</a></li>
<li><a href="3D Modeling.html">3D Modeling</a></li>
<li><a href="Fine Art.html">Fine Art</a></li>
<li><a href="Contact.html">Contact</a></li>
<li><a href="Help.html">Help</a></li>
</ul>
<ul>
<script>
var page_list = document.querySelectorAll('a');
// This will append to the web page, the URLs of each link, each formatted as a bullet point, i.e. list item.
var i = 0;
while (i < page_list.length) {
document.write('<li>' + page_list[i] + '</li>');
i = i + 1;
}
</script>
</ul>Did you want the items you produce with document.write to be the link text, rather than the URLs?
If so, try this:
<ul>
<li><a href="Web Development.html">Web Development</a></li>
<li><a href="Automotive Design.html">Automorive Design</a></li>
<li><a href="Editorial Design.html">Editorial Design</a></li>
<li><a href="3D Modeling.html">3D Modeling</a></li>
<li><a href="Fine Art.html">Fine Art</a></li>
<li><a href="Contact.html">Contact</a></li>
<li><a href="Help.html">Help</a></li>
</ul>
<ul>
<script>
var page_list = document.querySelectorAll('a');
// This will append to the web page, the Link Text of each link, each formatted as a bullet point, i.e. list item.
var i = 0;
while (i < page_list.length) {
document.write('<li>' + page_list[i].innerText + '</li>');
i = i + 1;
}
// This will append the 2nd URL (#1, with the first being #0), without formatting as a bullet point.
document.write(page_list[1]);
</script>
</ul>Or did you want to reproduce a complete link?
i.e. displayed on screen as the innerText, but functioning as a link (containing the full URL inside it)?
If so, try this:
<ul>
<li><a href="Web Development.html">Web Development</a></li>
<li><a href="Automotive Design.html">Automorive Design</a></li>
<li><a href="Editorial Design.html">Editorial Design</a></li>
<li><a href="3D Modeling.html">3D Modeling</a></li>
<li><a href="Fine Art.html">Fine Art</a></li>
<li><a href="Contact.html">Contact</a></li>
<li><a href="Help.html">Help</a></li>
</ul>
<script>
var page_list = document.querySelectorAll('a');
document.write('<ul>')
var i = 0;
while (i < page_list.length) {
document.write('<li><a href=' + page_list[i] + '>' + page_list[i].innerText + '</a></li>');
i = i + 1;
}
document.write('/<ul>')
</script>One more thing – the UL markers
I see you are trying to stuff the entire script tag inside a ul tag, in the hope that this will make the output go into a UL list. Nice try! But it won’t work. 😎
Wherever you write the document.write, it will always be APPENDING to the web page, i.e. at the end. So to get the effect you want you should put a document.write of the UL tag before you do your list of document.writes, and a /UL> afterwards obviously.
Best to mentally think of document.write as really being named document.append.