常連

拍手喝采

自己紹介

以下のように配列に連想配列を格納し、その中身について検索したい場合はどのようにすればよいのでしょうか？


```Javascript
var item = [{id:33,name:"太郎"},{id:23,name:"花子"}]
```

例えばidで検索をかけ、名前を取り出したいときはどうすればよいでしょうか？

追記
さらに配列のインデックスの値をとることは可能でしょうか？

配列中の連想配列を検索したい時

### 前提・実現したいこと
カラム：kei(int), payment(int=初期値:0)

例えばpaymentが1になっているkeiのみ取り出して表示させたいのですが

$total = array_column($rows, 'kei');
$sum_total = array_sum($total);

上記の全体合計値からどうすればいいのか分からず、お知恵を拝借できたらと思います。
よろしくお願い致します！

array_columnでカラムの合計値を条件付きで絞るにはどうすればよいでしょうか？

### 前提・実現したいこと

新規スマホページを制作しています。
ドロワー、スライドバナー、iframeの自動高さ調節のJqueryを1ページ内で動作させたいのですが、jqueryの3.2.1と1.6.1を共存させると下の行に記述したjqueryしか有効にならないようで、共存させる方法を試したのですがうまくいきません。$161等に置き換える方法を試しましたが当方はJSをカスタマイズした経験がなく、既存のコードを書き換える方法を教えていただけないでしょうか。

### 該当のソースコード
```
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js"></script> 



<script>
//iframe高さ自動調節
$(function(){
	//iframe1
	setTimeout(function(){
		$("iframe[src='main.htm']").iframeAutoHeight();
	},1000);

	//iframe2
	setTimeout(function(){
		$("iframe[src='footer.htm']").iframeAutoHeight();
	},1000);

});
-->
</script>


<script>
//カルーセルバナー（中央寄せ両サイド表示レスポンシブ）
$(function() {
	$('.center-item').slick({
		infinite: true,
		dots:true,
		slidesToShow: 1,
		centerMode: true, //要素を中央寄せ
		centerPadding:'0', //両サイドの見えている部分のサイズ
		autoplay:true, //自動再生
		responsive: [{
			breakpoint: 480,
				settings: {
					centerMode: false,
			}
		}]
	});
});
</script>
```


### 試したこと

```
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.5, user-scalable=yes">
<base target="_top">
<link rel="stylesheet" href="style.css"> 
<link rel="stylesheet" href="slide_banner/slick-theme.css"> 
<link rel="stylesheet" href="slide_banner/slick.css"> 
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Merriweather"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js"></script>
<script src="drawer/drawer.js"></script> 
<script src="slide_banner/slick.min.js"></script> 
<script src="iframe_autoheight/jquery.browser.js"></script> 
<script src="iframe_autoheight/jquery-iframe-auto-height.min.js"></script> 


<script>
//jQuery 3.2.1は"$"で、
//jQuery 1.6.1は"$161"で呼び出せるようにする
var $161 = $.noConflict(true);

$(function(){

  setTimeout(function(){
    //jQuery 1.6.1でアクセスする要素は、$の代わりに$161でアクセスする
    $161("iframe[src='main.htm']").iframeAutoHeight();
  }, 1000);

  setTimeout(function(){
    $161("iframe[src='footer.htm']").iframeAutoHeight();
  }, 1000);

});
</script>

<script>
$(function() {
  //jQuery 3.2.1でアクセスする要素はそのまま
  $('.center-item').slick({
    infinite: true,
    dots:true,
    slidesToShow: 1,
    centerMode: true,
    centerPadding:'0',
    autoplay:true,
    responsive: [{
      breakpoint: 480,
      settings: {
        centerMode: false,
      }
    }]
  });
});
</script>


</head>
<body>

      <header>
      <div id="head_flex">
	<div class="left">&nbsp;</div>
	<div class="center"><img src="img/logo.png"></div>
	<div class="right">
	<div class="drawer_menu">

		<div class="drawer_bg"></div>
		<button type="button" class="drawer_button">
			<span class="drawer_bar drawer_bar1"></span>
			<span class="drawer_bar drawer_bar2"></span>
			<span class="drawer_bar drawer_bar3"></span>
			<span class="drawer_menu_text drawer_text">MENU</span>
			<span class="drawer_close drawer_text">CLOSE</span>
		</button>
		<nav class="drawer_nav_wrapper">
		<iframe src="https://www.rakuten.ne.jp/gold/loopsky/sptest/drawer.htm" scrolling="yes" width="100%" height="100%" frameborder="0"></iframe>
		</nav>
	</div>
	</div>
      </div>
      </header>


      <ul class="slider center-item">
	<li><img src="https://www.rakuten.ne.jp/gold/loopsky/header_wideslider/img/index/key-performax01.jpg"></li>
	<li><a href="https://item.rakuten.co.jp/loopsky/organdy-curtain/"><img src="https://www.rakuten.ne.jp/gold/loopsky/header_wideslider/img/index/key-curtain.jpg"></a></li>
	<li><a href="https://item.rakuten.co.jp/loopsky/tbstl-15/"><img src="img/slide/tbstl-15.jpg"></a></li>
	<li><a href="https://item.rakuten.co.jp/loopsky/as-282sbr/"><img src="img/slide/as-282sbr.jpg"></a></li>
	<li><a href="https://item.rakuten.co.jp/loopsky/52551/"><img src="img/slide/52551.jpg"></a></li>
	<li><a href="https://item.rakuten.co.jp/loopsky/52820/"><img src="img/slide/52820.jpg"></a></li>
      </ul>


      <iframe src="main.htm" scrolling="no"></iframe>
      <iframe src="footer.htm" scrolling="no"></iframe>


</body>
</html>



```

1.6.1に関するJSの記述をせず下記の記述だけの場合、ドロワー、スライドバナーは問題なく作動します。
```
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.js"></script>

<script>
$(function() {
  //jQuery 3.2.1でアクセスする要素はそのまま
  $('.center-item').slick({
    infinite: true,
    dots:true,
    slidesToShow: 1,
    centerMode: true,
    centerPadding:'0',
    autoplay:true,
    responsive: [{
      breakpoint: 480,
      settings: {
        centerMode: false,
      }
    }]
  });
});
</script>
```


下記を追記すると、ドロワーは問題ありませんが、スライドバナーの左右のボタンを押したときにアニメーションが動作しません。
```
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js"></script>
```


下記も追加すると、iframeの高さ調整ができるようになり、ドロワーも問題ありませんが、スライドバナーの画像が縦に並んだレイアウトになってしまいます。
```
<script>
//jQuery 3.2.1は"$"で、
//jQuery 1.6.1は"$161"で呼び出せるようにする
var $161 = $.noConflict(true);

$(function(){

  setTimeout(function(){
    //jQuery 1.6.1でアクセスする要素は、$の代わりに$161でアクセスする
    $161("iframe[src='main.htm']").iframeAutoHeight();
  }, 1000);

  setTimeout(function(){
    $161("iframe[src='footer.htm']").iframeAutoHeight();
  }, 1000);

});
</script>
```

Jquery　バージョン違いの2つを有効にする方法

# 前提・実現したいこと
参考書をもとに、Ruby on Railsを使いブログサイトを作っています
見出しに下線を使いたいのですが、そこでスタイリングに躓いてしまったので質問しました

# 試したこと
Googleで検索しましたが、borderで円を作る方法などが出るばかりで、下線の四隅を丸くする方法がのっていませんでした
border-styleにも四隅を丸くする方法はありませんでした

どのようにCSSでプログラミングすればいいかがわかりません。

教えてください。よろしくお願い致します。