How to replace script content without manually modification

Question

The following snippet seems need to repetitively type the same server host "http://106.232.2.2:3000/"

I wonder if there is any js toolchain can let me maintain this in more effective way like the example with my expectation. It should be run in pruly js without any backend techniques.

current version

<script src="http://106.232.2.2:3000/assets/jquery-9e7b5a8e0157d7776b987d8963c9c786.js?body=1" data-turbolinks-track="true"></script>
<script src="http://106.232.2.2:3000/assets/jquery_ujs-38e73f935d8e2feac7f47b8c67317969.js?body=1" data-turbolinks-track="true"></script>
<script src="http://106.232.2.2:3000/assets/comment-ce9e9195c9ca532a7968ea39a6e1f67f.js?body=1" data-turbolinks-track="true"></script>
<script src="http://106.232.2.2:3000/assets/application-52b017a9dbb00790db4e22316964e7d9.js?body=1" data-turbolinks-track="true"></script>
<link href="http://106.232.2.2:3000/assets/css/bootstrap-5c674533b683d85b12a4a4b13ee83e70.css" rel="stylesheet">
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" rel="stylesheet">
<link href="http://106.232.2.2:3000/assets/css/mint-admin-78ba3e0ba257aa211af6ecf2ddf7f553.css" rel="stylesheet">

expected version

define SERVER_HOST =  http://106.232.2.2:3000
<script src="$SERVER_HOST/assets/jquery-9e7b5a8e0157d7776b987d8963c9c786.js?body=1" data-turbolinks-track="true"></script>
<script src="$SERVER_HOST/assets/jquery_ujs-38e73f935d8e2feac7f47b8c67317969.js?body=1" data-turbolinks-track="true"></script>
<script src="$SERVER_HOST/assets/comment-ce9e9195c9ca532a7968ea39a6e1f67f.js?body=1" data-turbolinks-track="true"></script>
<script src="$SERVER_HOST/assets/application-52b017a9dbb00790db4e22316964e7d9.js?body=1" data-turbolinks-track="true"></script>
<link href="$SERVER_HOST/assets/css/bootstrap-5c674533b683d85b12a4a4b13ee83e70.css" rel="stylesheet">
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" rel="stylesheet">
<link href="$SERVER_HOST/assets/css/mint-admin-78ba3e0ba257aa211af6ecf2ddf7f553.css" rel="stylesheet">

How about using DNS?

Tamas Hegedus
– Tamas Hegedus

2015-12-27 03:16:04 +00:00
Commented Dec 27, 2015 at 3:16 — Tamas Hegedus
– Tamas Hegedus, Commented Dec 27, 2015 at 3:16

Tamas Hegedus · Accepted Answer · 2015-12-27 03:19:41Z

1

I feel a bit of a contradiction there:

I wonder if there is any js toolchain ...

It should be run in pruly js without any backend techniques.

Anyway, you can insert those script andlink tags dynamically:

var SERVER_HOST = 'http://106.232.2.2:3000';
var scriptTag = document.createElement('script');
scriptTag.setAttribute('src', SERVER_HOST + '/assets/jquery-9e7b5a8e0157d7776b987d8963c9c786.js?body=1');
scriptTag.setAttribute('data-turbolinks-track', 'true');
document.head.appendChild(scriptTag);

answered Dec 27, 2015 at 3:19

Tamas Hegedus

30.1k12 gold badges67 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

newBike Over a year ago

Hi, Does some js tool like require.js or webpack can do this ?

Tamas Hegedus Over a year ago

Those are for handling module dependencies. I'm pretty sure you can accomplish that with properly configuring require.js and requiring the appropriate modules, However you could use the above snippet. Lightweight and easy to understand.

kiranvj · Accepted Answer · 2015-12-27 03:23:57Z

1

Try something like this.

var baseUrl = 'http://106.232.2.2:3000';

var urlArray = ["/assets/jquery-9e7b5a8e0157d7776b987d8963c9c786.js?body=1",
                "/assets/jquery_ujs-38e73f935d8e2feac7f47b8c67317969.js?body=1"];
var s;

for(var i = 0 ; i < urlArray.length; i ++) {
    s = document.createElement('script');
    s.src = baseUrl + urlArray[i];
    document.getElementsByTagName('head')[0].appendChild(s);
}

Option 2 (HTML option)

<base href="http://106.232.2.2:3000/">
<script src="assets/jquery-9e7b5a8e0157d7776b987d8963c9c786.js?body=1" data-turbolinks-track="true"></script>
<script src="assets/jquery_ujs-38e73f935d8e2feac7f47b8c67317969.js?body=1" data-turbolinks-track="true"></script>
<script src="assets/comment-ce9e9195c9ca532a7968ea39a6e1f67f.js?body=1" data-turbolinks-track="true"></script>

edited Dec 27, 2015 at 3:23

answered Dec 27, 2015 at 3:18

kiranvj

34.2k8 gold badges75 silver badges81 bronze badges

3 Comments

newBike Over a year ago

i can understand this way, but it seems not so intuitive to do so. but still thx for your suggestion :)

kiranvj Over a year ago

@newBike Give a try with Option2

newBike Over a year ago

Hi, Does some js tool like require.js or webpack can do this ?

Collectives™ on Stack Overflow

How to replace script content without manually modification

current version

expected version

2 Answers 2

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

current version

expected version

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related