Menu
Community /Pin to ProfileBookmark
Davinci•003 auto-replyTo create an external link using external JavaScript, you can dynamically set the
1. **HTML Setup**: First, you need an anchor tag in your HTML where the link will be placed. You can assign it an
``
This setup ensures that your link is dynamically set when the page loads, and since it's done through an external JavaScript file, it keeps your HTML clean and separates concerns effectively.
@AxyonorigDec 21.2025 — #Yes the above helps a bit, but I want it to happen when an image is clicked.@AxyonorigDec 22.2025 — #I solved my problem:
<img align="center" src="../image/site_cognac-ton.jpg"
Making an external link using external javascript
I have an image on my webpage, when I click on it, it opens another website. This is the code: <a href=”https://www.pierrevin.com/ ” target=”_blank”><img align=”center” alt=”www.pierrevin.com Le site des étiquettes de vins” border=”0″ src=”../image/site_cognac-ton.jpg”></a>. I am trying to make it work via external javascript, but I can’t get it to work. I am very much a beginner. Here is what I thought should work:
The code in the BODY: <a href=”cognacton.js”><img align=”center” src=”../image/site_cognac-ton.jpg” alt=”www.cognac-ton Le site des étiquettes de cognac”></a>
The scriptline in the HEAD: <script src=”../css/js/cognacton.js”</script>
The text in cognacton.js: window.location.href=”https://www.pierrevin.com/”
When I click on the image ‘site_cognac-ton.jpg’ on my webpage, the result is a white page with the text of the js-file: window.location.href=”https://www.pierrevin.com/”. Why does it not open the www.pierrevin.com website?
Thanks in advance, Ton
Sign in
to post a comment3 Comments(s) ↴
Davinci•003 auto-replyTo create an external link using external JavaScript, you can dynamically set the href attribute of an anchor (<a>) tag in your HTML. Here’s a step-by-step guide on how to do this:1. **HTML Setup**: First, you need an anchor tag in your HTML where the link will be placed. You can assign it an
id for easy access.``
html
<a id="myExternalLink">Click Here</a>
`
2. **External JavaScript File**: In your external JavaScript file, you will write the code to set the attribute of the anchor tag.
`javascript
document.addEventListener('DOMContentLoaded', function() {
var link = document.getElementById('myExternalLink');
link.href = 'https://www.example.com';
link.target = '_blank'; // Optional: Opens the link in a new tab
});
`
3. **Linking the JavaScript File**: Make sure to link the external JavaScript file in your HTML file. This should be placed inside the tag or just before the closing 
tag.
`html
<script src="path/to/your/script.js"></script>
`
Here’s how your complete setup might look:
**HTML File (index.html):**
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>External Link Example</title>
<script src="script.js"></script>
</head>
<body>
<a id="myExternalLink">Click Here</a>
</body>
</html>
`
**JavaScript File (script.js):**
javascript
document.addEventListener('DOMContentLoaded', function() {
var link = document.getElementById('myExternalLink');
link.href = 'https://www.example.com';
link.target = '_blank'; // Optional: Opens the link in a new tab
});
``This setup ensures that your link is dynamically set when the page loads, and since it's done through an external JavaScript file, it keeps your HTML clean and separates concerns effectively.
0
@AxyonorigDec 21.2025 — #Yes the above helps a bit, but I want it to happen when an image is clicked.0
@AxyonorigDec 22.2025 — #I solved my problem:<img align="center" src="../image/site_cognac-ton.jpg"