Copy part of html tag to another
My php pages have some images in them, that I want to copy one of them to the <meta property="og:image" content="" /> tag in the head section of the page.
Example of the image tag:
<img class="img-responsive" border="0" src="../../../Gallery/path/file.jpg" alt="some text" width="640" height="460">
Expected output (to be added to the section) that trims everything from the above line, and just takes the path of the image from it:
<meta property="og:image" content="../../../Gallery/path/file.jpg" />
I tried somethings in the line with getElementById and innerHTML but it's not working. Also something like: jQuery( "img.img-responsive" );, (but it takes the whole line). I think it needs something like .removeAttr() but I am not sure how implement all that together.
Another thing, and I am not sure if it is doable: If the page has more classes with the same name but with different images, is it possible to specify in the jQuery or Javascript code which image to use? (for example adding,1for the first image, or,2to copy only the second?
javascript jquery html getelementbyid
asked Jan 1 at 19:27
MikeMike
53221130
add a comment |
My php pages have some images in them, that I want to copy one of them to the <meta property="og:image" content="" /> tag in the head section of the page.
Example of the image tag:
<img class="img-responsive" border="0" src="../../../Gallery/path/file.jpg" alt="some text" width="640" height="460">
Expected output (to be added to the section) that trims everything from the above line, and just takes the path of the image from it:
<meta property="og:image" content="../../../Gallery/path/file.jpg" />
I tried somethings in the line with getElementById and innerHTML but it's not working. Also something like: jQuery( "img.img-responsive" );, (but it takes the whole line). I think it needs something like .removeAttr() but I am not sure how implement all that together.
Another thing, and I am not sure if it is doable: If the page has more classes with the same name but with different images, is it possible to specify in the jQuery or Javascript code which image to use? (for example adding,1for the first image, or,2to copy only the second?
javascript jquery html getelementbyid
asked Jan 1 at 19:27
MikeMike
53221130
You answered your own question. " jQuery( "img.img-responsive" ); (but it takes the whole line). " You can do a php function called strpos($haystack, $needle) to find your src part and save it in content. Let me know if i was helpful and you need a demo for that.
– Hassaan Ali
Jan 1 at 19:37
@HassaanAli Thanks for the reply, a demo would be great to test.
– Mike
Jan 1 at 20:30
How is this a "php" question?
– Funk Forty Niner
Jan 2 at 4:26
@FunkFortyNiner It's just that I'll be using that script in php.. But you are right, I removed the php tag..
– Mike
Jan 2 at 4:45
Thanks Mike :) It makes a question unclear I feel as well as being (a tad) misleading for those such as I that follow that tag, had it been a php-related issue.
– Funk Forty Niner
Jan 2 at 4:46
add a comment |
My php pages have some images in them, that I want to copy one of them to the <meta property="og:image" content="" /> tag in the head section of the page.
Example of the image tag:
<img class="img-responsive" border="0" src="../../../Gallery/path/file.jpg" alt="some text" width="640" height="460">
Expected output (to be added to the section) that trims everything from the above line, and just takes the path of the image from it:
<meta property="og:image" content="../../../Gallery/path/file.jpg" />
I tried somethings in the line with getElementById and innerHTML but it's not working. Also something like: jQuery( "img.img-responsive" );, (but it takes the whole line). I think it needs something like .removeAttr() but I am not sure how implement all that together.
Another thing, and I am not sure if it is doable: If the page has more classes with the same name but with different images, is it possible to specify in the jQuery or Javascript code which image to use? (for example adding,1for the first image, or,2to copy only the second?
javascript jquery html getelementbyid
asked Jan 1 at 19:27
MikeMike
53221130
My php pages have some images in them, that I want to copy one of them to the <meta property="og:image" content="" /> tag in the head section of the page.
Example of the image tag:
<img class="img-responsive" border="0" src="../../../Gallery/path/file.jpg" alt="some text" width="640" height="460">
Expected output (to be added to the section) that trims everything from the above line, and just takes the path of the image from it:
<meta property="og:image" content="../../../Gallery/path/file.jpg" />
I tried somethings in the line with getElementById and innerHTML but it's not working. Also something like: jQuery( "img.img-responsive" );, (but it takes the whole line). I think it needs something like .removeAttr() but I am not sure how implement all that together.
Another thing, and I am not sure if it is doable: If the page has more classes with the same name but with different images, is it possible to specify in the jQuery or Javascript code which image to use? (for example adding,1for the first image, or,2to copy only the second?
javascript jquery html getelementbyid
javascript jquery html getelementbyid
asked Jan 1 at 19:27
MikeMike
53221130
asked Jan 1 at 19:27
MikeMike
53221130
edited Jan 19 at 18:35
Mike
asked Jan 1 at 19:27
MikeMike
53221130
asked Jan 1 at 19:27
MikeMike
53221130
asked Jan 1 at 19:27
MikeMike
53221130
53221130
You answered your own question. " jQuery( "img.img-responsive" ); (but it takes the whole line). " You can do a php function called strpos($haystack, $needle) to find your src part and save it in content. Let me know if i was helpful and you need a demo for that.
– Hassaan Ali
Jan 1 at 19:37
@HassaanAli Thanks for the reply, a demo would be great to test.
– Mike
Jan 1 at 20:30
How is this a "php" question?
– Funk Forty Niner
Jan 2 at 4:26
@FunkFortyNiner It's just that I'll be using that script in php.. But you are right, I removed the php tag..
– Mike
Jan 2 at 4:45
Thanks Mike :) It makes a question unclear I feel as well as being (a tad) misleading for those such as I that follow that tag, had it been a php-related issue.
– Funk Forty Niner
Jan 2 at 4:46
add a comment |
You answered your own question. " jQuery( "img.img-responsive" ); (but it takes the whole line). " You can do a php function called strpos($haystack, $needle) to find your src part and save it in content. Let me know if i was helpful and you need a demo for that.
– Hassaan Ali
Jan 1 at 19:37
@HassaanAli Thanks for the reply, a demo would be great to test.
– Mike
Jan 1 at 20:30
How is this a "php" question?
– Funk Forty Niner
Jan 2 at 4:26
@FunkFortyNiner It's just that I'll be using that script in php.. But you are right, I removed the php tag..
– Mike
Jan 2 at 4:45
Thanks Mike :) It makes a question unclear I feel as well as being (a tad) misleading for those such as I that follow that tag, had it been a php-related issue.
– Funk Forty Niner
Jan 2 at 4:46
You answered your own question. " jQuery( "img.img-responsive" ); (but it takes the whole line). " You can do a php function called strpos($haystack, $needle) to find your src part and save it in content. Let me know if i was helpful and you need a demo for that.
– Hassaan Ali
Jan 1 at 19:37
You answered your own question. " jQuery( "img.img-responsive" ); (but it takes the whole line). " You can do a php function called strpos($haystack, $needle) to find your src part and save it in content. Let me know if i was helpful and you need a demo for that.
– Hassaan Ali
Jan 1 at 19:37
@HassaanAli Thanks for the reply, a demo would be great to test.
– Mike
Jan 1 at 20:30
@HassaanAli Thanks for the reply, a demo would be great to test.
– Mike
Jan 1 at 20:30
How is this a "php" question?
– Funk Forty Niner
Jan 2 at 4:26
How is this a "php" question?
– Funk Forty Niner
Jan 2 at 4:26
@FunkFortyNiner It's just that I'll be using that script in php.. But you are right, I removed the php tag..
– Mike
Jan 2 at 4:45
@FunkFortyNiner It's just that I'll be using that script in php.. But you are right, I removed the php tag..
– Mike
Jan 2 at 4:45
Thanks Mike :) It makes a question unclear I feel as well as being (a tad) misleading for those such as I that follow that tag, had it been a php-related issue.
– Funk Forty Niner
Jan 2 at 4:46
Thanks Mike :) It makes a question unclear I feel as well as being (a tad) misleading for those such as I that follow that tag, had it been a php-related issue.
– Funk Forty Niner
Jan 2 at 4:46
add a comment |
1 Answer
1
active
oldest
votes
Take a look at attr() http://api.jquery.com/attr/ and eq() https://api.jquery.com/eq-selector/
$('meta[property="og:image"]').attr('content', $('.img-responsive:eq(2)').attr('src') ); // eq(2) for the 3rd image
edited Jan 2 at 4:24
DaFois
2,01941419
answered Jan 1 at 19:34
RichardRichard
327410
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53998303%2fcopy-part-of-html-tag-to-another%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Take a look at attr() http://api.jquery.com/attr/ and eq() https://api.jquery.com/eq-selector/
$('meta[property="og:image"]').attr('content', $('.img-responsive:eq(2)').attr('src') ); // eq(2) for the 3rd image
edited Jan 2 at 4:24
DaFois
2,01941419
answered Jan 1 at 19:34
RichardRichard
327410
add a comment |
Take a look at attr() http://api.jquery.com/attr/ and eq() https://api.jquery.com/eq-selector/
$('meta[property="og:image"]').attr('content', $('.img-responsive:eq(2)').attr('src') ); // eq(2) for the 3rd image
edited Jan 2 at 4:24
DaFois
2,01941419
answered Jan 1 at 19:34
RichardRichard
327410
add a comment |
Take a look at attr() http://api.jquery.com/attr/ and eq() https://api.jquery.com/eq-selector/
$('meta[property="og:image"]').attr('content', $('.img-responsive:eq(2)').attr('src') ); // eq(2) for the 3rd image
edited Jan 2 at 4:24
DaFois
2,01941419
answered Jan 1 at 19:34
RichardRichard
327410
Take a look at attr() http://api.jquery.com/attr/ and eq() https://api.jquery.com/eq-selector/
$('meta[property="og:image"]').attr('content', $('.img-responsive:eq(2)').attr('src') ); // eq(2) for the 3rd image
edited Jan 2 at 4:24
DaFois
2,01941419
answered Jan 1 at 19:34
RichardRichard
327410
edited Jan 2 at 4:24
DaFois
2,01941419
edited Jan 2 at 4:24
DaFois
2,01941419
edited Jan 2 at 4:24
DaFois
2,01941419
2,01941419
answered Jan 1 at 19:34
RichardRichard
327410
answered Jan 1 at 19:34
RichardRichard
327410
answered Jan 1 at 19:34
RichardRichard
327410
327410
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53998303%2fcopy-part-of-html-tag-to-another%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
You answered your own question. " jQuery( "img.img-responsive" ); (but it takes the whole line). " You can do a php function called strpos($haystack, $needle) to find your src part and save it in content. Let me know if i was helpful and you need a demo for that.
– Hassaan Ali
Jan 1 at 19:37
@HassaanAli Thanks for the reply, a demo would be great to test.
– Mike
Jan 1 at 20:30
How is this a "php" question?
– Funk Forty Niner
Jan 2 at 4:26
@FunkFortyNiner It's just that I'll be using that script in php.. But you are right, I removed the php tag..
– Mike
Jan 2 at 4:45
Thanks Mike :) It makes a question unclear I feel as well as being (a tad) misleading for those such as I that follow that tag, had it been a php-related issue.
– Funk Forty Niner
Jan 2 at 4:46