We Keep Coding

Javascript document.querySelector just need the value

my webpage excerpt looks like this
<div class="current-timestamp" style="--duration:"00:13:19"; --absolute-position:"00:00:00";"><span class="position"></span><span class="divider"></span><span class="duration"></span></div>
i try to get the value 00:13:19 via the chrome console with this command
document.querySelector(".current-timestamp");
however i receive the full code like above.
What do i need to do to just receive "00:13:19" ?

It's not common to store the value of a component in a CSS variable like you have done, however it can be accessed in the following way:
getComputedStyle(document.querySelector(".current-timestamp")).getPropertyValue("--duration");
Essentially, we are getting the computed style of the element in question, and then using getPropertyValue to get the value of the duration variable on the element.
However, I would highly advise against using CSS variables for storing non-style related values in the future.
Edit: This can actually be done using the style property directly, as this is set on the element itself:
document.querySelector(".current-timestamp").style.getPropertyValue("--duration");

Setting and getting bootstrap radio button inside angular repeat loop

I am trying to set the default button and get the current selected value.
The example without the repeat loop works.
Here is my plnkr:
http://plnkr.co/edit/t9CefA5bhLZs3RASmEUG?p=preview
It is based on this example:
http://plnkr.co/edit/LFj4inY9TLYZs9z7yHCr?p=preview
Thank you!

So, there were 2 things going on in your plunker.
Firstly the btn-radio attribute doesn't need interpolation ({{}}) you can (and should) provide an expression directly. So just write btn-radio="company.id" instead of btn-radio="{{company.id}}".
Secondly, you must know that the ng-repeat directive creates a new scope. This is a very, very common conceptual issue people have with AngularJS so I would encourage you to read https://github.com/angular/angular.js/wiki/The-Nuances-of-Scope-Prototypal-Inheritance
Coming back to you particular problem you can either change you ng-model expression to point to a parent scope (ng-model="$parent.radioModel") or bind to an object property (ng-model="radioModel.id").
Here is a working plunk with the second approach:
http://plnkr.co/edit/uGAxaRlPFK6sD4tRjGXX?p=preview

Variable expression into javascript without using th:inline

I searched first but I found confusing answers since I'm new to Thymeleaf and amateurish at best at javascript.
I just want to know how to pass variable expressions into javascript functions, sort of like in JSP:
Button
Of course, this fails with Thymeleaf and passes the string ${contact.id} instead of its value, so how could I get the value of the variable expression instead?
The reason I want it this way is because it depends on the row which is being iterated by th:each.
If there's no other way except to use th:inline, then what's the best approach considering the above statement?

This one worked:
th:onclick="'javascript:getContactId(\'' + ${contact.id} + '\');'"
Thanks goes out to the thymeleaf forum:
http://forum.thymeleaf.org/variable-expression-into-javascript-without-using-th-inline-td4025534.html

In Thymeleaf version 2.1, I have not been able to get the accepted answer to work. I did find some guidance from a Twitter post from Thymeleaf. Rather than using th:onclick, you use th:attr and specify the onclick attribute therein.
th:attr="onclick='javascript:getContactId(\'' + ${contact.id} + '\');'"

You can not put javascript variables into onclick or other DOM attributes. The value of onclick or any other DOM attribute should be a constant string.
However, you can dynamically modify value of onclick attribute from javascript, like this:
yourDomElement.onclick = anyVariable;

You can do this like:
th:onclick="'javascript:getContactId(\'' + ${contact.id} + '\');'"

A more generic approach, if you need in JS something that isn't passed as a event handler parameter:
th:attr="data-myValueFromThymeleaf=${contact.id}"
Any attribute whose name is starting with data- is ignored by all browsers. So it won't affect the UI and you can easily read the value in javascript.
I prefer this because it's not ideal to put javascript code in html (see unobtrusive javascript)

I have asked the Thymeleaf project on twitter, and their answer is:
You can use both the "+" operator or literal substitutions. For example: <a th:href="|javascript:change('start','${taskId}')|">
For more info: https://www.thymeleaf.org/doc/articles/standarddialect5minutes.html
I have tried, and it works~

Simple jQuery chain methods throws error

I have a very simple jQuery method chain that is throwing an error. All it's supposed to do is replace the "#" with a new value ("test.html"). I'm doing this because I'm retrieving a value from a database and want to update specific links in the markup. I have verified that the href attribute is, in fact "#". But I'm getting an "Object doesn't support this property or method" error. I'm using jquery-1.7.1.min.js.
Can someone tell me what's wrong with this statement:
$('a#protoPath').attr('href').html('test.html');

.attr('href') returns the current attribute contents, not another jQuery object, so it can't be chained.
You need to use .attr('href', newValue) if you want to actually change it.
If you only want to change the one link that has "#" as its href you need to change your selector, too:
$('a[href="#"]')

You're trying to set HTML content on an element attribute, try instead :
$('a#protoPath').attr('href', 'test.html');

Try this instead:
$('a#protoPath').attr('href', 'test.html');

Control references in jQuery

function eegetdropdownvalue_str(ctl){return ctl.selectedIndex>=0&&ctl[ctl.selectedIndex]?ctl[ctl.selectedIndex].value:''}
The above function is called with
co.p1A10=eegetdropdownvalue_str(document.formc.p1A10);
I want to switch the call over to jQuery to drop the document.form reference however doing this
co.p1A10=eegetdropdownvalue_str($('p1A10'));
Does not reference the control correctly - How should I do this?

There's two things wrong with your code.
First, $('p1A10') references nothing.
jQuery selectors work almost identically (if not completely identically) to the way css works.
So, just ask yourself how you would reference the object(s) in question in CSS and you're half way there.
I'm assuming that p1A10 is the name or id of an object. Since we're using CSS/jQuery syntax, this should be an id, although you can select by other attributes such as $("select[name='p1A10']") .
To reference an object by ID we use the # character (again, just like in CSS). So we can select your node via $('#p1A10').
The second problem is that your function is expecting a DOM object not a jQuery object. To keep your code intact, we need to say $('#p1A10')[0] where 0 is the first element within the collection of jQuery elements.
I've provided two examples to explain this a little better. One uses your existing infrastructure and one replaces it.
http://jsfiddle.net/TD6Uu/5/
Hope it helps.

Given a form with id formc and a select with name p1A10 you could e.g. use:
o.p1A10 = eegetdropdownvalue_str($('#formc select[name="p1A10"]').get(0));
If this doesn't do it, please provide use with the exact HTML structure